HTML элемент <label>
представляет собой подпись к элементу пользовательского интерфейса.
Категории контента | Общий поток, текстовый контентt, интерактивный контент, элемент формы, palpable content. |
---|---|
Разрешенный контент | Текстовый контент, но без вложенных элементов label . Недопустимы другие оборачиваемые в label элементы помимо целевого. |
Пропуск тегов | None, both the starting and ending tag are mandatory. |
Разрешенные предки | Любой элемент, разрешающий текстовый контент. |
Разрешенные ARIA роли | Отсутствуют |
DOM interface | HTMLLabelElement |
Тип | Строчный |
Атрибуты
Элемент поддерживает глобальные атрибуты .
for
-
ID labelable-элемента, который находится в том же документе, что и элемент label. Первый такой элемент в документе, ID которого совпадает со значением атрибута
for
, становится labeled-контролом для данногоlabel
.A label element can have both afor
attribute and a contained control element, as long as thefor
attribute points to the contained control element. form
HTML5- The form element with which the label is associated (its form owner). If specified, the value of the attribute is the ID of a
<form>
element in the same document. This lets you place label elements anywhere within a document, not just as descendants of their form elements.
This content attribute was removed from the HTML specification on April 28, 2016. However, scripts still have access to a read-onlyHTMLLabelElement.form
attribute; it returns the form of which the label's associated control is a member, ornull
if the label is not associated with a control or the control isn't part of a form.
Usage notes
- A
<label>
can be associated with a control either by placing the control element inside the<label>
element, or by using thefor
attribute. Such a control is called the labeled control of the label element. One input can be associated with multiple labels. - Labels are not themselves directly associated with forms. They are only indirectly associated with forms through the controls with which they're associated.
Examples
Simple label example
<label>Click me <input type="text"></label>
Using the "for" attribute
<label for="username">Click me</label> <input type="text" id="username">
Specifications
Specification | Status | Comment |
---|---|---|
HTML Living Standard Определение '<label>' в этой спецификации. |
Живой стандарт | |
HTML5 Определение '<label>' в этой спецификации. |
Рекомендация | |
HTML 4.01 Specification Определение '<label>' в этой спецификации. |
Рекомендация | Initial definition |
Browser compatibility
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | (Да) | (Да) | (Да)[1] | (Да) | (Да) | (Да) |
Feature | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | (Да) | (Да) | (Да)[1] | (Да) | (Да) | (Да) |
[1] Starting with Gecko 8.0 (Firefox 8.0 / Thunderbird 8.0 / SeaMonkey 2.5), a bubbling click event triggers at most one <label>
, and the synthetic click event cannot trigger additional <label>
s. In Gecko, a click event will still bubble up past a <label>
, while in WebKit or Internet Explorer the click event will stop at the <label>
. The behavior prior to Gecko 8.0 (triggering multiple <label>
s) caused Firefox to stop responding (see баг 646157).
[2] The HTML specification was updated in April 2016 to deprecate the form
attribute. It's still available from script, but its definition has changed: it now returns the associated control's form, or null
if there is no associated control (that is, if HTMLLabelElement.control
is null
). See HTMLLabelElement.form
.
This change is implemented in Firefox 49.
See also
- Other form-related elements:
<form>
,<input>
,<button>
,<datalist>
,<legend>
,<select>
,<optgroup>
,<option>
,<textarea>
,<keygen>
,<fieldset>
,<output>
,<progress>
and<meter>
.