HTML Element: select

Examples

Syntax

1

<select name="name" required>

2

 <option value="1">John</option>

3

 <option value="2">Jane</option>

4

 <option value="3">Donald</option>

5

 <option value="4">Chuck</option>

6

 <option value="5">Leslie</option>

7

</select>

A select element with the multiple attribute enabled (true) allows for multiple options to submit with a form submission.

1

<select multiple name="name" required>

2

 <option value="1">John</option>

3

 <option value="2">Jane</option>

4

 <option value="3">Donald</option>

5

 <option value="4">Chuck</option>

6

 <option value="5">Leslie</option>

7

</select>

Result

Browser Support

The select element is supported in all modern browsers. Read more on caniuse.com. 

Browsers display select elements differently, depending on their rendering engine. Take a look at this example which shows the same select element in Google Chrome (powered by Blink), Firefox (powered by Quantum), and Safari (powered by WebKit). 

Attributes

A select element supports Global Attributes in HTML. Global Attributes are common to all HTML elements and can be used on all of them (though they may not have much of an effect on some of them).

In addition to global attributes the select element has a group of other attributes:

• autocomplete: Hit for a form to autofill.
• disabled: Whether or not the form control is disabled.
• form: Associates the select with a form element.
• multiple: Whether or not to allow multiple values.
• name: The name of the element to use for form submissions or via the form.elements API.
• required: Whether the select is required for form submission.
• size: Size of the select.

Content

The select element supports zero or more option, optgroup, and script-supporting elements.

• The <select> element is usually found within a <form>, though it’s perfectly valid HTML to have a <select> elsewhere.
• The <select> element is very similar to the <datalist> element, as both give users multiple <option>s to select from. However, <datalist> is more a list of suggested options, and users can actually enter their own value.

Learn More