HTML_폼요소3 <label,fieldset,form>

<label> 태그

<label>태그는 form 요소의 이름과 form 요소를 명시적으로 연결시켜줄때 이용하며

웹접근성 향상에 도움이 되기 때문에 필수적으로 선언을 해주셔야합니다.

 

기존 : 아이디 따로 text 상자 따로 선언되어있음

->label : label의 id 속성값을 통해 아이디라는 텍스트와 text 상자의 관계를 연결함.

<label>을 통해 관계를 연결한 경우 이를 클릭했을 때 해당 form 요소를 클릭한 것처럼 동작합니다.

Ex: 아이디라는 글자를 누르면 옆에 텍스트 상자에 입력할 수 있도록 활성화 됩니다.

 

<input>태그 이용 중 radio나 checkbox처럼 리스트목록 중 선택해야하는 경우에는

선택항목과 form요소가 잘 관계될 수 있도록 주의해서 설정해야합니다.

Ex: 성별:남자 ㅇ 여자 ㅇ 인경우, radio체크박스는 남자/여자와 label 형성이 되어야지, 성별과 label형성하면 안됩니다.

 

 

<fieldset> 태그와 <legend> 태그

<fieldset> : 여러개의 폼 요소를 그룹화하여 구조적으로 만들기 위해 사용. 보통 form의 성격에 따라 구분.

<legend> : 폼요소의 제목으로 반드시 <fieldset> 내부 최상단에 작성.

 

---

<form태그>

<form>태그는 form요소를 감싸는 태그로 데이터를 묶어서 실제 서버로 전송해주는 역할을 하는 태그입니다.

만약 <fieldset>으로 구조화되어있다면 <fieldset>도 함께 감싸는 역할을 합니다.

- action 속성 : 폼데이터를 처리하기위한 서버의 주소

- method 속성 : 데이터를 전송하기위한 방식을 지정

                     1. get 방식 : 데이터가 전송될때 주소창에 파라미터 형태로 붙어 데이터가 노출됩니다.

                     2. post 방식 : 데이터가 전송될 때 데이터가 노출되지 않습니다.(보안)