久々のHTML小ネタ。
<form>要素の部品に<label>という地味な感じの要素がある。対になる<input>や<textarea>の説明などが入ることが多いのだが、ラベルというからにはそれなりの機能も持っている。
以下は、FC2おなじみの秘信チェックボックスの一般的なソースです。
<label for="himitu">秘密</label><input id="himitu" type="checkbox" name="comment[himitu]" tabindex="1" />この for="himitu"は id="himitu"に対応していて、ラベル内の文字列またはイメージを Tabキーやマウスで選択することで目的の部品（この場合はチェックボックス）にフォーカスを当てられる。特に小さなラジオボタンやチェックボックスの操作には欠かせない要素だったのです。
そして、これは同じ効果を得るのに以下のように書くことができる。
<label>秘密<input type="checkbox" name="comment[himitu]" tabindex="1" /></label><label>要素の中に部品を含めてしまうことで、for=〜と id=〜を省略可。単にソースコードが短くなるという以外に、CSSでブロックが作りやすくなる利点もあるんじゃなかろか。こんな風にしてたのが
<p><label for="himitu">秘密</label><input id="himitu" type="checkbox" name="comment[himitu]" tabindex="1" /></p>これで済む。
label {display: block;}本当にHTMLネタなのか？
< ソムコン折り返し | アンフェア電波中年 > | 表紙へ戻る |