HTMLタグ辞典

実践に役立つオリジナルHTMLタグ辞典。
HTMLタグ

label

labelとは

ユーザインターフェイス要素の説明ラベルを表します。このラベルは、for属性を利用して、フォーム内のコントロール要素と明示的に関連付けすることができます。もしくは、label要素の中に、コントロール要素を内包する事によっても同じ用に関連付けができます。

labelで関連付けできる要素は、フォーム要素である場合が多いでしょう。しかし、そうでない要素も存在します。

ラベル付けできるHTML要素

  • button
  • input (if the type attribute is not in the hidden state)
  • select
  • textarea
  • keygen
  • meter
  • output
  • progress

labelの使用例

<form action="/contact/" method="put">

  <label>
    <input type="radio" name="meal" value="fish">Fish
  </label>

  <label>
    <input type="radio" name="meal" value="chicken">Chicken
  </label>

  <input type="submit" value="Send">
</form>

 

<form action="/contact/" method="put">

  <input id="radioFish" type="radio" name="meal" value="fish"><label for="radioFish">Fish</label>
  <input type="radio" name="meal" value="chicken"><label for="radioChicken">Chicken</label>

  <input type="submit" value="Send">

</form>

 

 

 

 


labelタグで利用可能な属性

この要素で利用可能なタグ属性とその値についてです。

Attribute Value Description
for 要素の名前(ID) ラベルが対応するフォーム内のコントロール要素を指定する。ラベルのクリックイベントを対応するコントロール要素のイベントとして処理するようになる。
form フォームの名前 そのラベルが所属するフォームを明示的に関連付ける
閉じる