HTML - form태그

<form>태그 

<form action="" method="">

  <input type="password" />

 

type=""만 입력하고 ""사이부분에 커서를 놓고 컨트롤 + 스페이스바를 누르면 사용가능한 type들이 나옴

 

<label>태그 

입력요소에 어떤 것을 입력하면 되는지 텍스트로 표현할 때 의미있게 코드를 작성하기 위한 태그

for 속성을 사용하여

<label for="id">아이디:</label> <input type="text" id="id" /> 형태로 사용하면 label의 글자만 클릭해도 입력요소가 활성화

 

명시적인 방법과 암묵적인 방법으로 구분

위와 같은 방식이 명시적인 방법임

암묵적인 방법 → label테이블을 form테이블의 자식으로 사용

ex. <label>아이디: <input type="text" /></label> (for속성, id속성 필요X)

암묵적+명시적 방법 혼합사용 하기도 함.

 

<fieldset>태그 - 상호작용 요소를 그룹화 하는데에 사용

 

<legend>태그 - 그룹화한 필드셋에 이름을 지정하는 태그

 

<textarea>태그 - 여러 줄을 입력할 수 있는 입력요소

 

<select>태그 - 선택지중 선택하도록

선택상자의 옵션 필요

ex.

<select>

  <option value="">남</option>

</select>

action속성에 설정된 서버로 데이터를 전달할 때 value속성의 값으로 보냄

<select size="2"> → size 속성을 통해 박스에서 보이는 갯수 설정가능

<select multiple> → 여러개 선택 가능

<option value="female" selected> → female을 처음 시작시 디폴트 값으로 설정

 

<optgroup>태그 - 옵션을 그룹화

label 태그와 함께 사용

ex.<optgroup label="성별"> ~~ 옵션내용 </optgroup>

 

<button>태그 - 버튼 (input 태그를 개선해서 나온 것) → 사용추천

 

공통속성

disabled → 버튼 등을 비활성화함

readonly → 볼수만 있고 편집 못하게 함

maxlength="2" → 최대 입력 글자 수 제한

 

checkbox에서 checked사용 체크박스 기본적으로 체크 된 상태에서 나옴

placeholder="아이디" → 입력 요소에 대한 힌트가 연하게 보이게 함 (한줄짜리 입력요소에 사용)