[HTML] 폼 태그, form, fieldset, legend, label, input

1. 폼 태그란?

폼 전체를 묶어서 데이터를 액션 페이지로 전송하는 태그

<form action="#">

</form>

 

2. 폼 구역 태그

- fieldset: 폼의 구역을 나누는 태그(부모)

- legend: 폼 구역의 직접 작성 태그(자손)

 

3. 폼 태그 기본 양식 태그 

• input: 사용자가 입력할 수 있는 입력 양식들을 의미하는 태그
• text: 한 줄 텍스트 입력 상자
• password: 텍스트 입력 시 암호화 처리 되는 입력 상자
• checkbox: 설문조사 시 이용되는 네모 체크박스 상자
• radio: 여러 개 중 하나만 체크되는 원형 체크박스 상자
• button: 일반 버튼 형태
• reset: 데이터 입력 취소 버튼
• submit: 데이터 전송 버튼
• image: 이미지 삽입 버튼
• file: 컴퓨터 파일 찾기 버튼 

<input type="text">

 

4. input 태그의 속성명들

• input의 maxlength: 최대 글자 지정
• inputd의 placeholder: 예시 텍스트
• id: label 태그와 연결될 값을 입력하는 속성 
• label: id와 연결하여 시각장애인 분들에게 얘기해 주는 속성 
• value: 기본값 입력 속성
• disabled: 입력 상자를  사용 불가능하게 만드는 속성

 

label이란?

input, select, textarea태그에 이름을 붙이는 태그

<label for="login">아이디</label>

<input type="text" id="login">

label의 for 속성값과 폼 자손 태그의 id 속성값은 같아야 함

 

선택상자 태그 select

select: 선택상자를 그룹화하는 태그

option: 선택 옵션 지정 태그

optionㅡselected: 선택지 초기 속성 지정 태그

optgroup: 옵션 태그를 그룹화하는 태그