/html/label:> Привязка к элементу формы_

Элемент label

Синтаксис

(X)HTML
<label> ... </label>

Описание

Элемент label (от англ. "label" ‒ «метка, надпись») устанавливает связь между меткой (текст, изображение) и элементом формы. В случае установления такой связи, например между содержимым данного элемента, и полем ввода, нажатие левой кнопки мыши на содержимое приводит к получению фокуса связанным элементом формы.

Примечание

Метки располагаемые внутри элемента label можно связать с элементом формы двумя различными способами:

  1. Вложив элемент формы в элемент label.
    <label>
     ...
     <input type="...">
     ...
    </label>
  2. Присоединив элемент label к элементу формы с помощью переметра «for».
    <label for="IDname"> ... </label>
    ...
    <input type="..." id="IDname">


Поддержка браузерами

Chrome
Поддерж.
Firefox
Поддерж.
Opera
Поддерж.
Maxthon
Поддерж.
IExplorer
Поддерж.
Safari
Поддерж.
iOS
Поддерж.
Android
Поддерж.

Спецификация

Верс. Раздел
HTML
2.0 ---
3.2 ---
4.01 17.9.1 The LABEL element
DTD: Transitional Strict Frameset
5.0 4.10.4 The label element
5.1 4.10.4. The label element
XHTML
1.0 Extensible HyperText Markup Language
DTD: Transitional Strict Frameset
1.1 Extensible HyperText Markup Language

Атрибуты

for
Связывает содержимое label элемента с элементом формы.
form
Присоединяет элемент к форме.
Глобальные атрибуты
accesskey, class, contenteditable, contextmenu, data-*, dir, draggable, dropzone, hidden, id, inert, lang, spellcheck, style, tabindex, title, translate, xml:lang

Пример использования

Листинг кода
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Элемент label</title>
</head>
<body>
<h1>Пример использования элемента "label"</h1>
<form action="/examples/php-scripts/coffee.php" method="post">
<fieldset> <legend><b>Какой кофе вы любите?</b></legend>
<label><input type="radio" name="coffee" value="without"> просто кофе (без всего)</label>
<label><input type="radio" name="coffee" value="milk"> с молоком</label><br>
<label><input type="checkbox" name="coffee_value" value="сахаром">с сахаром</label>
</fieldset>
<p><input type="reset"> <input type="submit"></p>
</form>
</body>
</html>
Элемент label