[HTML] HTML labal for 속성

< labal for 속성 >

 

 

labal 속성은 주로 라디오버튼이나 체크박스를 쓸 때 주로 사용된다.
라디오버튼이나 체크박스 아이콘은 직접 누르기에 작기때문에
옆에 설명글을 클릭했을 때 버튼이 선택되도록 기능한다.


평상시에는 요렇게 label 태그가 input 태그를 감싸는 형태로 작업을 해왔었다.

<label><input type="radio" name="yesno" value="yes">예</label>
<label><input type="radio" name="yesno" value="no">아니오</label>

하지만 for 속성을 이용하면 텍스트에만 label 태그를 붙여준다.

<input type="radio" name="yesno" id="yes">
<label for="yes">yes</label>

<input type="radio" name="yesno" id="no">
<label for="no">no</label>

 

label태그를 클릭했을때 선택될 라디오버튼의 id를 for 속성값을 넣어주면 된다.

위, 아래 두 방법 어떤걸 쓰는가는 사용하는 사람 마음이지만
이왕이면 웹표준에 맞게 작업하는게 좋을것 같다.