Homepage Zero ガイド
logo

ゼロから始めよう!わかりやすい!ホームページ作成ガイド

初めての方へ|総合案内|お問い合わせ|当サイトについて

ホームページ初心者ガイド| HTML| CSS| ホームページお役立ち情報| ホームページレベルアップ情報| その他

ホームHTMLリファレンス(アルファベット検索)><optgroup>タグ

HTMLタグ辞典
タグ一覧(ABC順) 目的別タグ一覧 スタイルシート一覧(ABC順) 目的別スタイルシート一覧

<optgroup>…セレクトボックスをグループ分けする

使用タグ

HTMLタグ

<optgroup 属性="属性値">〜</optgroup>

開始タグと
終了タグ

両方必須

内容となる
要素

option 要素

対応ブラウザ IE6 WinFireFox WinSafariFireFox MacIE5 macOpera

解説

<optgrouo>タグ<select>〜</select>内で使うことで、セレクトボックス内の<option>タグで作成した選択肢をグループ分けすることができます。
選択肢を作成するには、<option>タグを<select>〜</select>内に並べて記述します。

属性と働き

属性 働き 指定できる値
label="テキスト" 選択肢のグループ名に表示される名前を指定できます

この属性は optgroup 要素必須属性です
テキスト
disabled="disabled" グループ化したすべての選択肢が操作不可能となります

対応していないブラウザがあります
disabled

使用例

記述例
<form action="sample.cgi" method="post">

お名前:<input type="text" name="id" size="10">

<div>
<select name="sentaku" size="1">
<optgroup label="グループ01">
<option value="01">選択肢01</option>
<option value="02">選択肢02</option>
<option value="03">選択肢03</option>
</optgroup>
<optgroup label="グループ02">
<option value="04">選択肢04</option>
<option value="05">選択肢05</option>
<option value="06">選択肢06</option>
</optgroup>
</select>
</div>

<input type="submit" value="送信">

</form>
↓
[ブラウザでの表示例]
 ブラウザ
お名前:

関連情報ページ

ページトップへ

ホームページ初心者ガイド| HTML| CSS| ホームページお役立ち情報| ホームページレベルアップ情報| その他

<TOP>

logo
ゼロから始めよう!わかりやすい!ホームページ作成ガイド

|初めての方へ|総合案内|お問い合わせ|当サイトについて|

copyright (C) TOMIY All Right Reserved
inserted by FC2 system