私たちはカジノサイトを独自にレビューしています。当社のリンクを通じてサインアップすると、追加料金なしで当社に手数料が発生する場合があります。
<label>タグは、フォーム入力欄のキャプションを表す際に使用します。
label要素は、フォームの各入力欄となるユーザーインターフェイスのキャプションを表します。
label要素で指定するキャプションと、フォームの各入力欄を関連付けるには、2通りの方法があります。
1つ目の方法は、label要素のfor属性の値と、
input要素、select要素、textarea要素などのフォーム部品のid名を同じものにする方法です。
label要素のfor属性の値とフォーム部品のid名が一致することで、
そのキャプションがどのフォーム入力欄のものなのかを関連付けます。
<input type="radio" name="yesno" id="kotae0"> <label for="kotae0">無回答</label>
<input type="radio" name="yesno" id="kotae1"> <label for="kotae1">はい</label>
<input type="radio" name="yesno" id="kotae2"> <label for="kotae2">いいえ</label>
2つ目の方法は、label要素自体の中にフォーム部品を配置することによって、
同じlabel要素内に記述されたキャプションとフォーム入力欄を関連付けます。
<label><input type="radio" name="yesno"> 無回答</label>
<label><input type="radio" name="yesno"> はい</label>
<label><input type="radio" name="yesno"> いいえ</label>
上記2つの使用例で、キャプションとフォーム入力欄を関連付ける方法を2つ示しました。
どちらの場合にも、キャプションのテキスト部分をクリック(タップ)すると、関連するチェックボックスがcheckedの状態になります。
この挙動から、テキスト部分とチェックボックスが関連付けられていることが確認できます。
もう一例、for属性を使用せずlabel要素自体の中にフォーム部品を配置したサンプルを示します。
<form action="./sample/posted.php" method="post">
<p><label>フルネーム: <input name=fn> <small>書式: 名 姓</small></label></p>
<p><label>年齢: <input name=age type=number min=0></label></p>
<p><label>郵便番号: <input name=pc> <small>書式: 0000-000</small></label></p>
<p><input type="submit" value="送信"></p>
</form>