728x90
<label> 태그의 for 속성은 라벨(label)과 결합될 요소를 명시한다.
<label for="요소 id">
요소 id : 라벨과 결합될 요소의 id 속성값
<form action="/examples/media/action_target.php" method="get">
당신의 나이대를 골라주세요.<br>
<input type="radio" name="ages" id="teen" value="teenage">
<label for="teen">10대</label><br>
<input type="radio" name="ages" id="twenty" value="twenties">
<label for="twenty">20대</label><br>
<input type="radio" name="ages" id="thirty" value="thirties">
<label for="thirty">30대</label><br>
<input type="radio" name="ages" id="forty" value="forties">
<label for="forty">40대 이상</label><br>
<input type="submit">
</form>
(label 태그 내부의 영역을 선택하면,
for 속성이 지정된 "box-item"인 id값을 찾는다.)
=> 클릭 영역이 넓어지는 이유.
버튼 영역 뿐만 아니라,
텍스트 영역까지 포함되어서
클릭이 가능하다!
→ 그래서 for, id는 이름을 같게 써준다.
728x90
'HTML&CSS' 카테고리의 다른 글
[favicon] favicon 만들어 적용하기 (0) | 2023.08.10 |
---|---|
[CSS]반응형 웹 사이트 / 적응형 웹 사이트 차이? (0) | 2023.08.09 |
[HTML] a 태그 target 속성 (0) | 2023.07.29 |
[HTML] dataset data속성 사용하기 (0) | 2023.07.28 |
[CSS] 마우스 hover시 이미지 확대하기 (크기 고정) (0) | 2023.07.27 |
댓글