リファレンス

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


 

<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 タグ一覧はこちら

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