Homepage Zero ガイド
logo

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

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

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

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

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

<select>…セレクトボックスを作る

使用タグ

HTMLタグ

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

開始タグと
終了タグ

両方必須

内容となる
要素

option 要素optgroup 要素

対応ブラウザ IE6 WinFireFox WinSafariFireFox MacIE5 macOpera

解説

<select>タグインライン要素でこれを使えば、フォームの中でセレクトボックスを作成することができます。選択肢を記述するには<option>タグを<select>〜</select>内に並べて記述します。また、選択肢をグループ分けするには、<optgroup>タグを使用します。
name 属性を使用するとその値のデータ名が<form>タグのaction属性で指定したサーバーに送信されます。

「フォーム」 とは、入力されたデータを、サーバー上のCGIなどのプログラム等へ送信するしくみです。 <form>〜</form>の中に<input>タグ(入力項目)、<textarea>タグ(長いテキストの入力欄)、<select>タグ(選択肢のメニュー)などを並べます。

属性と働き

属性 働き 指定できる値
name="データ名" サーバーに送るデータ名を指定できます テキスト
size="行の数" セレクトボックスに一度に表示される選択肢の行の数を指定できます 「1」(プルダウンメニュー)、「2」以上(リスト式メニュー)を指定
multiple="multiple" セレクトボックスのリスト式メニュー(size属性の値を「2」以上)にしたときに、複数の選択枠を選択できるようになります ピクセルを表す整数で指定
disabled="disabled" ユーザーがメニュー操作不可能となり、サーバーにも値は送信されません disabled

使用例

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

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

<div>
<select name="seibetu" size="2">
<option value="01">男性</option>
<option value="02">女性</option>
</select>
</div>

<div>
<select name="tosi" size="1">
<option value="01">10代</option>
<option value="02">20代</option>
<option value="03">30代</option>
<option value="04">40代</option>
<option value="05">50代</option>
<option value="06">60代以上</option>
</select>
</div>

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

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

関連情報ページ

ページトップへ

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

<TOP>

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

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

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