HTML <label> 태그

예시

레이블이 있는 라디오 버튼 3개:

<form action="/action_page.php">
<input type="radio" id="html" name="fav_language" value="HTML">
<label for="html">HTML</label><br>
<input type="radio" id="css" name="fav_language" value="CSS">
<label for="css">CSS</label><br>
<input type="radio" id="javascript" name="fav_language" value="JavaScript">
<label for="javascript">JavaScript</label><br><br>
<input type="submit" value="Submit">
</form>

정의 및 사용

<label>태그는 여러 요소에 대한 레이블을 정의합니다 .

위의 요소와 함께 레이블을 적절하게 사용하면 다음과 같은 이점이 있습니다.

스크린 리더 사용자(사용자가 요소에 집중할 때 레이블을 소리내어 읽음)
매우 작은 영역(예: 체크박스)을 클릭하는 데 어려움을 겪는 사용자 - 사용자가 요소 내의 텍스트를 클릭하면 <label>입력이 토글되기 때문입니다(이것은 적중 영역을 증가시킴).

팁 및 참고 사항

팁: for 속성은 <label> 관련 요소의 id 속성과 같아야 함께 바인딩됩니다. 요소 내부에 요소를 배치하여 레이블을 요소에 바인딩할 수도 있습니다 <label>.

브라우저 지원

Element
<label>	Yes	Yes	Yes	Yes	Yes

속성

Attribute	Value	Description
for	element_id	Specifies the id of the form element the label should be bound to
form	form_id	Specifies which form the label belongs to

전역 속성

<label>태그는 HTML의 전역 속성도 지원 합니다 .

이벤트 속성

<label>태그는 HTML의 이벤트 속성 도 지원합니다 .

기본 CSS 설정

대부분의 브라우저는 <label>다음 기본값으로 요소를 표시합니다.

예시

label {
cursor: default;
}

❮ 이전 완전한 HTML 참조 다음 ❯

HTML 참조

HTML Tags