Create a drop-down list with four options:
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
Try it Yourself ❯
<select> 要素は、ドロップダウンリストを作成するために使用します。
<select> 要素内の <option> タグは、選択肢のリストを定義します。
| 要素 | |||||
|---|---|---|---|---|---|
| <select> | Yes | Yes | Yes | Yes | Yes |
チップ: <select> 要素は、フォームコントロールで、ユーザ入力収集のためのフォームで使用することができます。
HTML5 には、幾つかの新規属性が追加されました。
= HTML5 で新規追加。
| 属性 | 値 | 説明 |
|---|---|---|
| autofocus | autofocus | ページをロードする時に、ドロップダウンリストが自動的にフォーカスを取得するように指定する |
| disabled | disabled | ドロップダウンリストを無効にする |
| form | form_id | select フィールドが属する 1 つ以上のフォームを定義する |
| multiple | multiple | 複数の選択肢を同時に選択できるように指定する |
| name | name | ドロップダウンリストの名前を定義する |
| required | required | フォームを送信する前に、ユーザが値を選択する必要であることを指定する |
| size | number | ドロップダウンリストに表示する選択肢の数を定義する |
<select> タグは、HTML のグローバル属性もサポートします。
<select> タグは、HTML のイベント属性もサポートします。
HTML DOM リファレンス：Select オブジェクト
CSS チュートリアル：Styling Forms
なし。