HTML
레이블 요소

통사론

• <label>Example <input type="radio" name="r"></label> // 컨트롤 요소 배치하기
• <label for="rad1">Example</label> <input id="rad1" type="radio" name="r"> // 사용하기 for 속성

매개 변수

기본 사용

라벨이있는 간단한 양식 ...

<form action="/login" method="POST">
    
    <label for="username">Username:</label>
    <input id="username" type="text" name="username" />

    <label for="pass">Password:</label>
    <input id="pass" type="password" name="pass" />

    <input type="submit" name="submit" />

</form>

<form id="my-form" action="/login" method="POST">
    
    <input id="username" type="text" name="username" />

    <label for="pass">Password:</label>
    <input id="pass" type="password" name="pass" />

    <input type="submit" name="submit" />

</form>

<label for="username" form="my-form">Username:</label>

라벨 정보

<label> 요소는 양식 동작 요소를 참조하는 데 사용됩니다.
사용자 인터페이스 의 범위에서는 유형 radio 또는 checkbox 와 같은 요소의 대상 / 선택을 쉽게하기 위해 사용됩니다.

래퍼로 <label>

원하는 액션 요소를 묶을 수 있습니다.

<label>
    <input type="checkbox" name="Cats">
    I like Cats!
</label>

(텍스트를 클릭하면 대상 input 이 상태 / 값을 토글합니다)

참조로 <label>

for 속성을 사용하면 컨트롤 요소를 label 자손으로 지정할 필요는 없지만 for 값은 그 ID와 일치해야합니다

<input id="cats" type="checkbox" name="Cats">
<label for="cats" >I like Cats!</label>

노트
<label> 요소 내에 하나 이상의 제어 요소를 사용하지 마십시오.