고급 - 입력 필드와 라벨(<label>) 연결하기

 

입력 필드와 <label>태그를 같이 사용하여 라벨을 클릭했을 경우 입력필드에 포커스를 줄 수 있다. 이 때 연결을 위한 설정은 입력 필드의 id 값과 <label>태그의 for 속성의 값을 일치시키면 된다.

 

<label for="id">아이디:</label><input type="text" name="id" id="id"/>

<label for="man">남자</label><input type="radio" name="man" id="man"/>

<label for="woman">여자</label><input type="radio" name="woman" id="woman"/>

 

라벨 태그의 for 속성의 값과 입력 필드의 id 속성이 값이 같으면 라벨과 입력 필드를 일치시킬 수 있다. 즉, 라벨을 클릭하면 입력필드에 포커스를 줄 수 있다.