<label> 【フォームの入力項目と項目名を関連付ける】

[IE5] [IE6] [IE7] [Fx1] [Fx2] [Op8] [Op9] [Ns6] [Ns7]

<label>タグは、<form>の各部品（チェックボックスや一行テキストエリアなど）と、その項目名を関連付けるために使用します。関連付けられた項目名をクリックすると、その項目が選択出来るようになります。

使用方法

for属性を一致させる
<label>タグのfor属性の値と、各部品のid属性の値に同じものを指定する事で両者を関連付ける方法です。こちらのやり方を推奨します。

<label>〜</label>で囲う
こちらは。<label>タグで項目と項目名を囲って関連付けます。対応していないブラウザがあるため、非推奨です。

<label>の使用例

ソース

<form action="http://#####.com/form.php" method="post">
<input type="radio" name="seireki" value="2000" id="n00">
<label for="n00">2000年</label>
<input type="radio" name="seireki" value="2001" id="n01">
<label for="n01">2001年</label>
<input type="radio" name="seireki" value="2002" id="n02">
<label for="n02">2002年</label>
<input type="radio" name="seireki" value="2003" id="n03">
<label for="n03">2003年</label>
<input type="radio" name="seireki" value="2004" id="n04">
<label for="n04">2004年</label>
<input type="radio" name="seireki" value="2005" id="n05">
<label for="n05">2005年</label>
<input type="submit" value="決定">
</form>

表示すると

西暦






入力フォーム 関連項目

<form> フォームを作成する 
<input> フォームを構成する部品を作成する 
<textarea> 複数行のテキストエリアを作成 
<select> セレクトボックスを作成する 
<option> セレクトボックスの選択肢を作成する 
<optgroup> セレクトボックスの選択肢をグループ化 
<fieldset> フォームの入力項目をグループ化する 
<legend> 入力項目グループにタイトルを付ける 
<label> フォームの入力項目と項目名を関連付ける 

戻る

TOP