HTML <Select> Tag

Definition

The <select> tag creates a control that enables you to select from a set of options in the form of a drop-down list.

Example

<label for="song-select">Choose a song:</label>
<select name="song-select" size=1 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

• Both the opening and closing tags are required.
• The <select> element may contain zero or more <option> or <optgroup> elements.
• The id attribute is needed to associate the <select> list with a label.
• The <option> elements within the <select> element specify the available options in the drop-down list.
• A name attribute is required. Otherwise, no data from the <select> will be submitted. This will also be used to reference the form data after submission.
• Make sure to add a <label> to enable assistive technologies, such as screen readers better understand the form.

Attributes

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

• autocomplete

  The autocomplete attribute is a hint for the form’s autofill feature.

• autofocus

  The autofocus attribute is a boolean that determines whether the drop-down list or <select> element should automatically get focus when the page loads.

• disabled

  The disabled attribute is a boolean that determines whether the <select> element is disabled.

• form

  The form attribute specifies the form the <select> control belongs to. This allows you to associate <select> elements to <form> elements anywhere in the document, not just to the child elements of the <form>.

• multiple

  The multiple attribute specifies that more than one value may be entered.

• name

  The name attribute specifies the name of the <select> element.

• required

  The required attribute is a boolean that determines whether a value has to be selected before form submission.

• size

  The size attribute specifies the number of rows in the list that is visible at any one time. The default is 0.

Best Practices

• You can group long lists of items using the <optgroup> tag.

Specification

• HTML Living Standard Specification
• HTML5 Specification

Browser Support

Desktop

Mobile