<optgroup> 【セレクトボックスの選択肢をグループ化】
[IE5] [IE6] [IE7] [Fx1] [Fx2] [Op8] [Op9] [Ns6] [Ns7]
<optgroup>タグは、<option>〜</option>をグループ化する際に使用します。
まず<optgroup>のlabel属性で大きな項目を作り、次に<option>のlabel属性で細かい項目に分けていきます。
与えられる属性
label="値"
グループ化したい内容で項目を指定します。
<optgroup>の使用例
ソース
<form action="http://#####.com/form.php" method="post">
スタジオ機材
<select name="studio">
<optgroup label="ギターアンプ">
<option value="marshall" label="マーシャル">マーシャル</option>
<option value="mesa" label="メサブギー">メサブギー</option>
<option value="fender" label="フェンダー">フェンダー</option>
<option value="roland" label="ローランド">ローランド</option>
</optgroup>
<optgroup label="ベースアンプ">
<option value="ampeg" label="アンペグ">アンペグ</option>
<option value="gibson" label="ギブソン">ギブソン</option>
<option value="hartke" label="ハートキー">ハートキー</option>
<option value="peavey" label="ピーヴィー">ピーヴィー</option>
</optgroup>
</select><br>
<input type="submit" value="決定">
</form>
スタジオ機材
<select name="studio">
<optgroup label="ギターアンプ">
<option value="marshall" label="マーシャル">マーシャル</option>
<option value="mesa" label="メサブギー">メサブギー</option>
<option value="fender" label="フェンダー">フェンダー</option>
<option value="roland" label="ローランド">ローランド</option>
</optgroup>
<optgroup label="ベースアンプ">
<option value="ampeg" label="アンペグ">アンペグ</option>
<option value="gibson" label="ギブソン">ギブソン</option>
<option value="hartke" label="ハートキー">ハートキー</option>
<option value="peavey" label="ピーヴィー">ピーヴィー</option>
</optgroup>
</select><br>
<input type="submit" value="決定">
</form>
表示すると
入力フォーム 関連項目
<form> | フォームを作成する |
<input> | フォームを構成する部品を作成する |
<textarea> | 複数行のテキストエリアを作成 |
<select> | セレクトボックスを作成する |
<option> | セレクトボックスの選択肢を作成する |
<optgroup> | セレクトボックスの選択肢をグループ化 |
<fieldset> | フォームの入力項目をグループ化する |
<legend> | 入力項目グループにタイトルを付ける |
<label> | フォームの入力項目と項目名を関連付ける |