<option>

<option> defines a choice inside select, optgroup, or datalist. In a conventional select its text is the visible label.

A working example

Use optionLink

HTML and CSS

HTML

<label for="size">Size</label
><select id="size" name="size">
  <option value="s">Small</option>
  <option value="m" selected>Medium</option>
  <option value="l" disabled>Large — unavailable</option>
</select>

CSS

/* Optional presentation */
label {
  display: block;
  margin: 0.75rem 0 0.25rem;
}
input,
select,
textarea,
button {
  font: inherit;
  max-width: 100%;
}

Edit HTML or CSS to update the preview as you type. Copy code snippet copies the selected tab. Preview spacing and font defaults are not included.

Use it in a form

The visible text “Medium” corresponds to the submitted value m. Without a value attribute, the option’s text supplies the value. selected chooses the initial selection; do not specify several initial selections in a single-choice select.

Common mistakes and accessibility

disabled makes the choice unavailable. A datalist option is a suggestion rather than a restriction on typed text. Styling and permissible richer content in customizable selects have separate support from plain-text native options.

Continue with select for the related behavior.

Sources and browser support

MDN: option describes the syntax and links to the specification and compatibility data. Check individual values in that table when supporting older browsers.