リファレンス

<label>要素の使い方・サンプルコード

Sara

<label>

<label>要素は、フォーム内にある要素の項目名・キャプションを表します。

デモ:label要素

属性

for

for 属性の値と input 要素の id 属性の値を一致させることで、関連付けることができます。

input 要素をlabel 要素に入れることができますが、この場合は for 属性と id 属性による関連付けは必要なくなります。

form

関連付けたい form 要素の id を指定します。

form 属性を指定することで、form 要素の子要素に label 要素を置かなくても、同じ HTML 文書中にあるフォームに関連付けることができます。

グローバル属性

全ての HTML に共通して使用できるグローバル属性はこちら

使用例

例① for 属性を使って input 要素と関連付ける方法

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

例② for 属性を使わずに input 要素と関連付ける方法

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

対応ブラウザ

関連するタグ

HTML タグ一覧はこちら

guest
0 Comments
Inline Feedbacks
View all comments
ABOUT ME
Sara
Sara
運営者
書籍やオンライン講座でプログラミングを勉強してフリーランスのプログラマーになりました。
このサイトでは「わかりやすく・シンプル」をモットーに、プログラミングの基礎からアプリ開発まで紹介します。
独学でプログラミングを勉強をしている方、基礎は勉強したけれど次に何をすれば良いか分からない...という方のお役に立てるサイトを目指しています。
0
この記事にコメントするx
記事URLをコピーしました