HTML <label> for 属性

HTML <label> タグ

定義と使用法

for 属性はラベルがどのフォーム要素にバインドされるかを定義します。

隠しと明示的な結びつけ

タグは以下の2つの方法のいずれかでフォームコントロールと関連付けられます：タグの内容としてフォームコントロールを使用するのは隠した形式であり、または<label>タグの下に： for 属性がターゲットフォームのidを名前付けることで明示的な形式になります。

例えば、XHTMLでは：

明示的な結びつけ：

<label for="SSN">身份证号码：</label>
<input type="text" name="IdNum" id="IN" />

隠した結びつけ：

<label>誕生日：<input type="text" name="DofB" /></label>

1番目のタグは「Social Security Number:」というテキストとフォームの社会保険番号のテキスト入力コントロール（"SocSecNum"）を明示的に結びつける形式です。 for 属性の値とコントロールのidはどちらもSSNです。2番目のタグ（"Date of Birth:")は必要ありません。 for 属性に関連するコントロールもid属性は必要ありません。それらは<label>タグ内に<input>タグを入れることで隠して結びつけられます。

例

3つのラベル付きのラジオボタンがあります：

<form action="/action_page.php">
  <input type="radio" id="html" name="fav_language" value="HTML">
  <label for="html">HTML</label><br>
  <input type="radio" id="css" name="fav_language" value="CSS">
  <label for="css">CSS</label><br>
  <input type="radio" id="javascript" name="fav_language" value="JavaScript">
  <label for="javascript">JavaScript</label><br><br>
  <input type="submit" value="送信">
</form>

自分で試してみる

文法

<label for="element_id">

属性値

値 説明
element_id タグにバインドされた要素の id。

ブラウザのサポート

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
サポート サポート サポート サポート サポート

HTML <label> タグ