HTMLリファレンスマニュアル

HTMLタグ完全ガイド

HTML: <label> タグ

HTMLの <label> 要素（タグ）は、ユーザーインターフェース内の特定の要素の説明を示します。<label>タグは、ユーザー入力（例：<button>、<input>、<meter>、<output>、<progress>、<select>、または <textarea>タグ）にタイトルを生成するために使用されます。このタグは通常、<label>要素と呼ばれます。

オンラインサンプル

二つの入力フィールドと関連するラベルを持つシンプルなHTMLフォーム：

例

!doctype　html>
<html>
<head>
<meta　charset="UTF-8">
<title>HTML5　ラベルタグの使用(基本チュートリアルウェブ oldtoolbag.com)</title>
</head>
<body>
<h1>ラベルの使用</h1>
<form　action="demo-form.php">
　　<label　for="company">会社:　</label>
　　<input　type="text"　name="company"　id="company"><br>
　　<label　for="address">住所:　</label>
　　<input　type="text"　name="address"　id="address"><br>
　　<input　type="submit"　value="提出">
</form>
</body>
</html>

テストを見てみる ‹/›

ブラウザの互換性

IEFirefoxOperaChromeSafari

現在、ほとんどのブラウザが <label> タグをサポートしています。

タグの定義及び使用説明

ラベルタグは、input要素にラベル（マーク）を定義します。これは、ウェブページ上にインタラクティブコントロールのタイトルを表示するために使用されます。

ラベル要素はユーザーに特別な効果を表示しませんが、マウスユーザーのためのアクセス性を向上させます。ラベル要素内でテキストをクリックすると、このコントロールがトリガーされます。つまり、ユーザーがこのタグを選択すると、ブラウザが自動的にタグに関連するフォームコントロールに焦点を合わせます。

<label> タグの "for" 属性は関連する要素の "id" 属性と同じでなければなりません。

ヒントと注意

ヒント:"for" 属性は label を別の要素にバインドすることができます。"for" 属性の値を関連する要素の id 属性の値に設定してください。

HTML 4.01 と HTML5の間の違い

"form" 属性は HTML5 の新しい属性。

属性

New：HTML5 新しい属性。

属性	値	説明
for	element_id	label がどのフォーム要素にバインドされるかを指定します。
formHTML5	form_id	label フィールドが属する一つまたは複数のフォームを指定します。

グローバル属性

<label> タグはグローバル属性をサポートしており、完全な属性リストを確認してください HTMLグローバル属性。

イベント属性をサポートしています

<label> タグはすべての HTMLイベント属性。

HTML: <legend> タグ HTML5: <keygen> タグ