<label>¶
Тег <label>
(от англ. label — метка, ярлык) устанавливает связь между определённой меткой, в качестве которой обычно выступает текст, и элементом формы (<input>
, <select>
, <textarea>
).
Такая связь необходима, чтобы изменять значения элементов формы при щелчке курсором мыши на текст. Кроме того, с помощью <label>
можно устанавливать горячие клавиши на клавиатуре и переходить на активный элемент подобно ссылкам.
Существует два способа связывания объекта и метки. Первый заключается в использовании идентификатора id
внутри элемента формы и указании его имени в качестве атрибута for
элемента <label>
. При втором способе элемент формы помещается внутрь контейнера <label>
.
Формы
Синтаксис¶
<input id="<идентификатор>" /><label for="<идентификатор>"
>Текст</label
>
<label><input /> Текст</label>
Закрывающий тег обязателен.
Атрибуты¶
for
- Идентификатор элемента, с которым следует установить связь.
Также для этого элемента доступны универсальные атрибуты.
for¶
Задаёт уникальный идентификатор, определяемый с помощью атрибута id
элемента <input>
, с которым следует установить связь. Атрибут for
необходимо задавать в том случае, когда элемент формы и текст разделены. Если <input>
размещается внутри контейнера <label>
, то применять атрибут for
не требуется.
Синтаксис
<label for="<идентификатор>">...</label>
Значения
Имя идентификатора. Такое имя чувствительно к регистру, поэтому его следует писать так же, как оно описано внутри элемента <input>
.
Значение по умолчанию
Нет.
Спецификации¶
Описание и примеры¶
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>LABEL</title>
</head>
<body>
<form action="handler.php">
<p><b>Выберите напиток</b></p>
<p>
<input type="checkbox" id="check1" /><label
for="check1"
>Коньяк</label
><br />
<input type="checkbox" id="check2" /><label
for="check2"
>Арманьяк</label
><br />
<input type="checkbox" id="check3" /><label
for="check3"
>Кальвадос</label
><br />
</p>
</form>
</body>
</html>
Ссылки¶
- Тег
<label>
MDN (рус.)