HTMLリファレンスマニュアル

HTMLタグ一覧

HTML: <select> タグ

HTMLの<select>要素は、ユーザーが選択できるドロップダウンリストを作成するコントロールを表します。これらのドロップダウン値は<select>タグ内の<options>タグのシリーズで定義されます。このタグは通常<select>要素とも呼ばれます。

オンラインサンプル

複数のオプションを持つドロップダウンリストを作成する：

サンプル

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML selectタグの使用(基本教程網　oldtoolbag.com)</title>
</head>
<body>
<label for="pet-select>ペットを選んでください:/label>
<select name="pets" id="pet-select>
　　　　<option value="">--オプションを選んでください--</option>
　　　　<option value="dog">Dog</option>
　　　　<option value="cat">Cat</option>
　　　　<option value="hamster">Hamster</option>
　　　　<option value="parrot">Parrot</option>
　　　　<option value="spider">Spider</option>
　　　　<option value="goldfish">Goldfish</option>
</select>
</body>
</html>

テストを見てみる‹/›

ブラウザ互換性

IEFirefoxOperaChromeSafari

すべての主要ブラウザが<select>タグをサポートしています。

タグの定義及び使用説明

<select>要素はドロップダウンリストを作成するために使用されます。
<select>要素内の <option> タグ、これらのタグはドロップダウン値リストと利用可能なオプションを提供します。

デフォルトで、<select>タグ内の最初のオプションが選択されたアイテムとして表示されます。ユーザーはドロップダウンリストから別のオプションを選択できます。

ヒントと注意

ヒント：<select> 要素はフォームでユーザー入力を受け入れるためのフォームコントロールです。

HTML 4.01 HTML5の違い

HTML5 新しい属性をいくつか追加しました。

属性

New ：HTML5 に追加された属性。

属性	値	説明
autofocusHTML5	autofocus	ページが読み込まれた際にドロップダウンリストが自動的にフォーカスを取得します。
disabled	disabled	この属性が true の場合、ドロップダウンリストが無効になります。
formHTML5	form_id	select フィールドが属するフォームを 1 つまたは複数指定します。
multiple	multiple	この属性が true の場合、複数のオプションを選択できます。
name	text	ドロップダウンリストの名前を定義します。
requiredHTML5	required	ユーザーがフォームを送信する前にドロップダウンリストのオプションを選択する必要があります。
size	number	ドロップダウンリストに表示されるオプションの数を指定します。

グローバル属性

<select> タグがサポートする HTML のグローバル属性。

イベント属性

<select> タグがサポートする HTML のイベント属性。

HTML DOM 参考マニュアル： Select オブジェクト

HTML: <small> タグ HTML: <section> タグ