HTML Form 폼

이번 글에서는 form에 대한것들을 설명한다

<form>, </form>

이 태그 안의 내용은 폼임을 알린다.

action

폼의 이름

method

정보를 입력받는 방법. ""안에 post 또는 get 두개 중 선택해서 넣을 수 있다.

짧은 정보는 get으로 써도 되지만 긴 정보는 주로 post로 받는다.

<input>

자료 입력창임을 알리는 태그

type

자료 입력창 중 하나를 골라 ""에 넣어준다. 

text 라면 로그인 아이디창 처럼 입력창이 뜬다.

password 는 위와 똑같지만 입력한 자료가 *로 바뀌어 나타난다.

checkbox는 체크를 할 수 있는 상자를 만든다. 뒤에 checked를 넣어주면 로딩 때 부터 체크가 되어 나온다.

태그를 >로 닫은 후 넣은 문자는 체크박스 옆에 나타난다.

radio는 점을 찍을 수 있는 동그라미를 만들어낸다.

submit는 입력 완료 후 정보를 전송하기 위한 버튼을 생성한다. value=""안에 넣는 문자가 버튼 위에 출력된다.

<textarea>, </textarea>

장문의 문자를 입력할 수 있는 칸을 생성한다. rows와 cols 에 값을 넣어 상자의 크기를 조절할 수 있다.

나중에 CSS로도 바꿀 수 있다.

>로 닫아주고</textarea>로 닫기 전 문자를 넣어주면 로딩 때 부터 상자에 그 문자가 찍혀 나온다.

<select>, </select>

드롭박스를 생성한다

<option>, </option>

드롭박스 내에서 목록을 구성하는 옵션이다.

열고 닫는 태그 사이에 문자를 넣어 옵션의 이름을 정해준다.

selected 를 붙여주면 로딩 때 부터 기본으로 그 옵션이 선택되어있다.

value=""에 값을 넣어주면 자료를 전송했을 때 옵션의 이름이 아닌 value의 값이 전송된다.

위의 코드를 저장하고 열었을때의 모습