トップページ > HTMLタグリファレンス > <LABEL>

★HTMLタグリファレンス

<LABEL> …… フォーム部品と項目名(ラベル)を関連付ける
Internet Explorer4Internet Explorer5Internet Explorer5-macInternet Explorer5.5Internet Explorer6Internet Explorer7Internet Explorer8Internet Explorer9 Netscape6Netscape7Netscape8 Opera7Opera8Opera9Opera10 Firefox1Firefox2Firefox3Firefox4 Google Chrome1Google Chrome2Google Chrome3Google Chrome4Google Chrome5Google Chrome6

<LABEL>タグはフォームの構成部品(一行テキストボックス・チェックボックス・ラジオボタン等)と、 その項目名(ラベル)を明確に関連付けるための要素です。 これによりチェックボックスやラジオボタンでは、 関連付けられたテキスト部分をクリックしてもチェックを付けることができるようになります。

<LABEL>タグの使用方法は2通りあります。 1つは<LABEL>タグのfor属性の値と、フォーム部品のid属性の値を同じものにすることで両者を関連付ける方法です。 もう1つは<LABEL>~</LABEL>内にフォーム部品とテキストを含める方法です。後者の方法は、Internet Explorer5や6には対応していないようなので、できるだけ前者を用いた方が良いでしょう。

accesskey属性はショートカットキーを割り当てる際に使用します。指定できる値は文字セットの中の任意の1文字です。 Windowsの場合は[Alt]キー、Macintoshの場合は[Control]キーと同時に押すと、そのラベルが選択された状態となります。

■使用例

HTMLソース

<form action="cgi-bin/formmail.cgi" method="post">
<label for="namae" accesskey="n">名前:</label>
<input type="text" name="name" id="namae"><br>
性別:<input type="radio" name="sex" value="male" id="otoko">
<label for="otoko" accesskey="m">男</label>
<input type="radio" name="sex" value="female" id="onna">
<label for="onna" accesskey="f">女</label><br>
血液型:<label><input type="radio" name="blood" value="a">A型</label>
<label><input type="radio" name="blood" value="b">B型</label>
<label><input type="radio" name="blood" value="o">O型</label>
<label><input type="radio" name="blood" value="ab">AB型</label><br>
<input type="submit" value="送信">
</form>
↓↓↓

ブラウザ上の表示


性別:
血液型:

■HTML5情報

<label> …… フォーム部品と項目名(ラベル)を関連付ける
▲ページ先頭へ
トップページ > HTMLタグリファレンス > <LABEL>
PR
MuuMuu Domain!
ドメイン取るならお名前.com
さくらのレンタルサーバ
ロリポップ!レンタルサーバー
HTMLクイックリファレンスについて
© HTMQ
[PR] ファッションコーディネートを自動作成