<LABEL>
フォーム部品と項目名（ラベルを関連付ける）
<LABEL>タグはフォームの構成部品（一行テキストボックス・チェックボックス・ラジオボタン等）と、その項目名（ラベル）を明確に関連付けるための要素です。これによりチェックボックスやラジオボタンでは、関連付けられたテキスト部分をクリックしてもチェックを付けることができるようになります。
<LABEL>タグの使用方法は2通りあります。1つは<LABEL>タグのfor属性の値と、フォーム部品のid属性の値を同じものにすることで両者を関連付ける方法です。もう1つは<LABEL>〜</LABEL>内にフォーム部品とテキストを含める方法です。後者の方法は、Internet Explorer5や6には対応していないようなので、できるだけ前者を用いた方が良いでしょう。
accesskey属性はショートカットキーを割り当てる際に使用します。指定できる値は文字セットの中の任意の1文字です。Windowsの場合は[Alt]キー、Macintoshの場合は[Control]キーと同時に押すと、そのラベルが選択された状態となります。
ソース
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>タイトル</title>
</head>
<body>
<form action="htmltag071.cgi" method="post">
<fieldset>
<legend>ユーザーデータ</legend>
お名前：<input type="text" name="name" size="20">
メール：<input type="text" name="mail" size="40">
ID：<input type="text" name="id" size="40">
パスワード：<input type="text" name="password" size="40">
性別：<input type="radio" name="sex" value="male" id="otoko">
<label for="man" accesskey="m">男</label>
<input type="radio" name="sex" value="female" id="onna">
<label for="woman" accesskey="f">女</label>
</fieldset>
</form>
</body>
</html>
対応ブラウザ
NS3・・・×- NS4・・・×
- NS6・・・○
- NS7・・・○
IE3・・・×- IE4・・・○
- IE5・・・○
- IE5.5・・・○
- IE6・・・○
O6・・・○- O7・・・○
FX1・・・○
更新履歴
- 2008.8.7
- linkページのリンクに、リンク先のサイトサムネイルを表示させるようにしました。
PORTFOLIOのページもサムネイルをクリックすることにより、画像を拡大して表示するようにしました。 - 2008.7.4
- linkに3件追加
- 2008.6.22
- Portfolioに1件追加
サイトデザイン修正 - 2008.6.17
- linkに1件追加
- 2008.1.19
- Portfolioに1点追加
- 2008.1.16
- Portfolioに2点追加
- 2007.9.29
- BLOG開始
- 2007.8.6
- HTMLに一件追加
- 2007.8.3
- サイトリニューアル
- 2007.6.19
- Portfolioに1点追加
- 2006.9.13
- Portfolioに1点追加
- 2006.8.11
- Portfolioに1点追加
- 2006.8.11
- Blog更新、BBS削除しました、LINKに1件追加
DARKNESS
このサイトへのリンクはフリーです。ご連絡していただければ相互リンクもいたします。リンクの際は下記バナをご利用ください。
- 31×31px
- 88×31px
- 188×29px