References

Beginner-friendly references for web development, with live, editable examples.

The HTML label attribute

Attribute All modern browsers Updated
Quick answer

The HTML label attribute gives a user-readable label for the group or option. It is used on the <optgroup> and <option> elements.

Overview

The label attribute labels an option group or option. It is used on the <option> and <optgroup> elements.

It configures the choices in a drop-down — labeling option groups and pre-selecting a default. These sit inside a <select>.

Syntax

<optgroup label="Fruit"><option>Apple</option></optgroup>

Values

Value
A string of label text.

Example

Live example 
<select><optgroup label="Fruit"><option>Apple</option><option>Pear</option></optgroup></select>

Best practices

  • Give an <optgroup> a label to head each section of a long drop-down.
  • Pre-select a default with the selected attribute on an <option>.
  • Always pair the <select> with a <label>.
  • Give each option a value when the submitted data differs from the visible text.

Frequently asked questions

What does the label attribute do?
Labels an option group or option.
How do I group options in a drop-down?
Wrap related <option> elements in an <optgroup> and set its label attribute.
How do I pre-select an option?
Add the selected attribute to that <option>.
Which elements use the label attribute?
It is an element-specific attribute, used on the <option> and <optgroup> elements.
kind label (track)