HTML <option> Tag

By Jonathan Griffin. Editor, SEO Consultant, & Developer.

· 2 min read

Definition

The <option> tag is used to define an item in a <select>, <optgroup>, or <datalist> element.

Example

<label for="song-select">Choose a song:</label>
<select id="song-select">
    <optgroup label="Oasis">
        <option>Wonderwall</option>
        <option>Don't look back in anger</option>
        <option>Supersonic</option>
    </optgroup>
    <optgroup label="Beetles">
        <option>Here comes the sun</option>
        <option>Hey Jude</option>
        <option>Let it be</option>
    </optgroup>
</select>

Usage

  • The <option> element can be used as a child of a <select>, <datalist>, or <optgroup> element.
  • An opening tag is required. If the <option> element is immediately followed by another <option>, or a <optgroup> element, or if there is no more content, the closing tag can be omitted.
  • Only text is permitted content.

Attributes

The <option> element supports the Global Attributes, along with the following:

  • disabled

    The disabled attribute is a boolean that determines whether the group of <option> elements is disabled.

  • label

    The label attribute represents the meaning of the option. If this attribute is used, it must not be left empty. If omitted, the <option> content will be used.

  • selected

    The selected attribute is a boolean that indicates whether the option is the default selected when the page loads. Only one <option> may have this attribute.

  • value

    The value attribute specifies the value to be sent to the server if the option is selected. If this attribute is omitted, the <option> content will be used.

Best Practices

Specification

Browser Support

Desktop

ChromeEdgeFirefoxIEOperaSafari
YesYesYesYesYesYes

Mobile

Android WebviewChrome AndroidFirefox AndroidOpera AndroidiOS SafariSamsung Internet
YesYesYesYesYesYes