<label>
**HTML-элемент <label> **представляет собой подпись к элементу пользовательского интерфейса.
| Категории контента | Общий поток, текстовый контент, интерактивный контент, элемент формы, ощутимый контент. |
|---|---|
| Допустимый контент | Текстовый контент, но без вложенных элементов label . Недопустимы другие оборачиваемые в label элементы помимо целевого. |
| Пропуск тегов | Нет, открывающий и закрывающий теги обязательны. |
| Допустимые родители | Любой элемент, разрешающий текстовый контент. |
| Допустимые ARIA-роли | Нет |
| DOM-интерфейс | HTMLLabelElement (en-US) |
Атрибуты
ID labelable-элемента, который находится в том же документе, что и элемент label. Первый такой элемент в документе, ID которого совпадает со значением атрибута for , становится labeled-* контролом для данного label .
Примечание: Элемент label может иметь как атрибут for, так и отдельный элемент управления, если атрибут for указывает на содержащийся элемент управления.
Элемент формы, с которым связан label (его владелец формы). Если указано, значением атрибута является идентификатор элемента <form> в том же документе. Это позволяет размещать элементы label в любом месте документа, а не только как потомки их элементов формы.
<label>¶
Тег <label> (от англ. label — метка, ярлык) устанавливает связь между определённой меткой, в качестве которой обычно выступает текст, и элементом формы ( <input> , <select> , <textarea> ).
Такая связь необходима, чтобы изменять значения элементов формы при щелчке курсором мыши на текст. Кроме того, с помощью <label> можно устанавливать горячие клавиши на клавиатуре и переходить на активный элемент подобно ссылкам.
Существует два способа связывания объекта и метки. Первый заключается в использовании идентификатора id внутри элемента формы и указании его имени в качестве атрибута for элемента <label> . При втором способе элемент формы помещается внутрь контейнера <label> .
Синтаксис¶
Закрывающий тег обязателен.
Атрибуты¶
Также для этого элемента доступны универсальные атрибуты.
Задаёт уникальный идентификатор, определяемый с помощью атрибута id элемента <input> , с которым следует установить связь. Атрибут for необходимо задавать в том случае, когда элемент формы и текст разделены. Если <input> размещается внутри контейнера <label> , то применять атрибут for не требуется.
Синтаксис
Значения
Имя идентификатора. Такое имя чувствительно к регистру, поэтому его следует писать так же, как оно описано внутри элемента <input> .
Зачем нужен label HTML?
Объясните, для того чтобы не только запомнить но и понять, зачем нужен тэг label для select и т.п.?
Если речь именно про тег, то:
Тег <label> устанавливает связь между определенной меткой, в качестве которой обычно выступает текст, и элементом формы ( <input> , <select> , <textarea> ). Такая связь необходима, чтобы изменять значения элементов формы при нажатии курсором мыши на текст. Кроме того, с помощью <label> можно устанавливать горячие клавиши на клавиатуре и переходить на активный элемент подобно ссылкам.
Существует два способа связывания объекта и метки. Первый заключается в использовании идентификатора id внутри элемента формы и указании его имени в качестве атрибута for тега <label> . При втором способе элемент формы помещается внутрь контейнера <label> .
Если речь про всё же про атрибут, то:
Атрибут предназначен для указания метки пункта списка, сокращённой по сравнению с текстом внутри <option> . Если атрибут label присутствует, то текст внутри тега <option> игнорируется и в списке выводится значение label .
# Label Element
The <label> element is used to reference a form action element.
In the scope of User Interface it’s used to ease the target / selection of elements like Type radio or checkbox .
<label> as wrapper
It can enclose the desired action element
(Clicking on the text the target input will toggle it’s state / value)
<label> as reference
Using the for attribute you don’t have to place the control element as descendant of label — but the for value must match it’s ID
Note
Don’t use more than one Control Element within a <label> element