Example
Create a drop-down list with four options:
Choose a car:
Volvo
Saab
Mercedes
Audi
Try it Yourself »
More "Try it Yourself" examples below.
Definition and Usage
The element is used to create a drop-down list.
The element is most often used in a form, to collect user input.
The name attribute is needed to reference the form data after the form is submitted [if you omit the
name attribute, no data from the drop-down list
will be submitted].
The id attribute is needed to associate the drop-down list with a label.
The tags inside the element define the available options in the drop-down list.
Tip: Always add the tag for best accessibility practices!
Browser Support
| Yes | Yes | Yes | Yes | Yes |
Attributes
| autofocus | autofocus | Specifies that the drop-down list should automatically get focus when the page loads |
| disabled | disabled | Specifies that a drop-down list should be disabled |
| form | form_id | Defines which form the drop-down list belongs to |
| multiple | multiple | Specifies that multiple options can be selected at once |
| name | name | Defines a name for the drop-down list |
| required | required | Specifies that the user is required to select a value before submitting the form |
| size | number | Defines the number of visible options in a drop-down list |
Global Attributes
The tag also supports the Global Attributes in HTML.
Event Attributes
The tag also supports the Event Attributes in HTML.
More Examples
Example
Use with tags:
Choose a car:
Volvo
Saab
Mercedes
Audi
Try it Yourself »
Related Pages
HTML DOM reference: Select Object
CSS Tutorial: Styling Forms
Default CSS Settings
None.
❮ HTML tag
Example
A drop-down list with a pre-selected option:
Choose a car:
Volvo
Saab
VW
Audi
Try it Yourself »
Definition and Usage
The selected attribute is a boolean attribute.
When present, it specifies that an option should be pre-selected when the page loads.
The pre-selected option will be displayed first in the drop-down list.
Tip: The
selected attribute can also be set after the page loads, with a JavaScript.
Browser Support
| selected | Yes | Yes | Yes | Yes | Yes |
Syntax
❮ HTML tag
Example
A drop-down list with four options:
Choose a car:
Volvo
Saab
Opel
Audi
Try it Yourself »
More "Try it Yourself" examples below.
Definition and Usage
The tag defines an option in a select list.
elements go inside a , , or element.
Note: The tag can be used without any attributes, but you usually need the value attribute, which indicates what is sent to the server on form submission.
Tip: If you have a long list of options, you can group related options within the tag.
Browser Support
| Yes | Yes | Yes | Yes | Yes |
Attributes
| disabled | disabled | Specifies that an option should be disabled |
| label | text | Specifies a shorter label for an option |
| selected | selected | Specifies that an option should be pre-selected when the page loads |
| value | text | Specifies the value to be sent to a server |
Global Attributes
The tag also supports the Global Attributes in HTML.
Event Attributes
The tag also supports the Event Attributes in HTML.
More Examples
Example
Use of in a element:
Choose your browser from the list:
Try it Yourself »
Example
Use of in elements:
Choose a car:
Volvo
Saab
Mercedes
Audi
Try it Yourself »
Related Pages
HTML DOM reference: Option Object
Default CSS Settings
None.