HTML <オプション>タグ
例
4つのオプションを含むドロップダウンリスト：
<label for="cars">Choose a car:</label>
<select id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
タグは、選択リストの<option>オプションを定義します。
<option>要素は、 <select>、
<optgroup>、または<datalist>要素の内部に入ります。
注：タグは属性なしで使用できますが、通常はvalue<option>属性が必要です。これは、フォーム送信時にサーバーに送信される内容を示します。
ヒント：オプションのリストが長い場合は、関連するオプションを<optgroup>タグ内でグループ化できます。
ブラウザのサポート
| Element | |||||
|---|---|---|---|---|---|
| <option> | Yes | Yes | Yes | Yes | Yes |
属性
| Attribute | Value | Description |
|---|---|---|
| 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 |
グローバル属性
この<option>タグは、HTMLのグローバル属性もサポートしています。
イベント属性
この<option>タグは、HTMLのイベント属性もサポートしています。
その他の例
例
<datalist>要素での<option>の使用：
<label for="browser">Choose your browser from the list:</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
<option value="Edge">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
例
<optgroup>要素での<option>の使用：
<label for="cars">Choose a car:</label>
<select id="cars">
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
関連ページ
HTML DOMリファレンス：オプションオブジェクト
デフォルトのCSS設定
なし。