label for|formのラジオボタンやチェックボックスをクリックしやすくするあれ。

  • このエントリーをはてなブックマークに追加
  • LINEで送る

明示的

inputのidとlabelのforを揃える / IE6でも使える。
[html]
<input type="radio" name="gender" id="m" value="男" />
<label for="m">男</label>
<input type="radio" name="gender" id="f" value="女" />
<label for="f">女</label>
[/html]

暗示的

inputをlabelで包む / IE6が対応してない。
[html]
<label>
<input type="radio" name="gender" id="m" value="男" />男
</label>
<label>
<input type="radio" name="gender" id="s" value="女" />女
</label>
[/html]

同じグループなのでname=”gender”は一緒。

動作サンプル|label for id

結局は、IE6が暗示的に結びつけられたlabelに対応してないから、記述の多い明示的な使い方をするしかなかったんですよね。
でも、もうそろそろ良いですよね。

formに必要なidとnameはDOCTYPEによって変わってくるみたい。

けどHTML4.01とXHTML1.0はとりあえず併記しておけば問題ないようだ
XHTML1.1は普段から使わないけど、formにnameを使わなければ問題ないぽい。
HTML5はどうなんだろう。

  • このエントリーをはてなブックマークに追加
  • LINEで送る

SNSでもご購読できます。

コメントを残す


You can add images to your comment by clicking here.