読者です 読者をやめる 読者になる 読者になる

ホームページ制作講座

ホームページ制作のHTMLやCSS、JavascriptやDTDとかDreamweaverなどWEB制作について

label(ラベル)タグHTMLタグ

コーディング関連でlabelタグのまとめです。

フォームページ中で、 タグでくくり、フォーム部品とラベルの関連付けをするためのタグです。


簡単な例でいうと、送信フォームページなどでテキストエリアの項目名をクリックすれば、該当するテキストフィールドにフォーカスがあうことができるタグです。


ラベルでくくることでブラウザでラベルをクリック時やアクセスキー設定などを、フォーム部品クリック時と同じ動きを設定することができます。

当然、終了タグが必須になるのでXHTML等で省略することが不可ですね。
インライン要素のタグになります。


■ ラベル指定方法は2種類


タイプ1:<label>〜</label> ラベルと部品を囲む

<label>お名前:<input type="text" name="uname"></label>


タイプ2:<label> for属性にフォーム部品のIDを割り振る

<label for="nm">お名前:</label>
<input id="nm" type="text" name="uname">

Internet Explorer6.0ではタイプ1の囲む形式はサポートされていないので、以下のような記述をおすすめします。


<label for="t1">
お名前: <input id="t1" type="text" name="uname">
</label>

■ 属性【固有属性】
accesskey=key ALT + アルファベットで指定したラベルにフォーカスされます
for=id フォーム部品のID属性値を参照します