<option> defines a choice inside select, optgroup, or datalist. In a conventional select its text is the visible label.
A working example
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.