The <label> element

An <label> element associates a text label with a form <input> field and is implemented using the DOM HTMLLabelElement interface. The label can tell users what value should be entered in the input field. Having labels helps the accessibility of a form. You can implicitly or explicitly associate a label with a form. When doing it explicitly, you use the for attribute, and implicitly, you nest the <input> directly inside the <label>.

Attributes

This element includes the global attributes.

for

The value of the for attribute must be a single id for a labelable form-related element in the same document as the <label> element. So, any given label element can be associated with only one form control.

Note: To programmatically set the for attribute, use htmlFor.

The first element in the document with an id attribute matching the value of the for attribute is the labeled control for this label element - if the element with that id is actually a labelable element. If it is not a labelable element, then the for attribute has no effect. If there are other elements that also match the id value, later in the document, they are not considered.

Multiple label elements can be given the same value for their for attribute; doing so causes the associated form control (the form control that for value references) to have multiple labels.

Note: A <label> element can have both a for attribute and a contained control element, as long as the for attribute points to the contained control element.