HTML option: Main Tips
- HTML
<option>specifies the possible options in a drop-down menu. <option>HTML works together with <select> element to create a drop-down menu for users to choose answers.- If the option list contains many suggested answers, it is better to divide them into groups with <optgroup>.
Purpose of option
<option> HTML sets suggested answers in <select> element list.
Example
<p>Which pet would you like to keep at home?</p>
<select>
<option value="cat">Cat</option>
<option value="wolf">Wolf</option>
<option value="llama">Llama</option>
</select>Attributes for option
selected
Make a specific HTML option selected as soon as the list opens by applying the selected attribute.
Example
<p>Which pet would you like to keep at home?</p>
<select>
<option value="cat">Cat</option>
<option value="wolf">Wolf</option>
<option value="llama" selected>Llama</option>
</select>disabled
When the opening HTML <option> tag contains the disabled attribute, the option won't be checkable.
Example
<p>Which pet would you like to keep at home?</p>
<select>
<option value="cat" disabled>Cat</option>
<option value="wolf">Wolf</option>
<option value="llama">Llama</option>
</select>label
HTML option label defines a shorter name for an option. The final option HTML list contains the shortened version.
Example
<p>Which pet would you like to keep at home?</p>
<select>
<option label="Cat">Cat - the tiger of the house</option>
<option label="Dog">Dog - best friend of the cat</option>
<option label="Llama">Llama - just fabulous</option>
</select>value
When the opening HTML <option> tag has the value attribute, it indicates the answer to be sent to a server (after an option is selected).
Example
<p>Which pet would you like to keep at home?</p>
<select>
<option value="cat">Cat</option>
<option value="wolf">Wolf</option>
<option value="llama">Llama</option>
</select>Browser support
Chrome
1+
Edge
All
Firefox
1+
IE
All
Opera
All
Safari
All
Mobile browser support
Chrome
All
Firefox
4+
Opera
All
Safari
All