<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>

対応ブラウザ

関連するタグ

• <input>：フォーム入力欄の作成

HTML タグ一覧はこちら

Subscribe

Notify of

new follow-up comments new replies to my comments

Label

{} [+]

お名前*

メールアドレス*

Label

{} [+]

お名前*

メールアドレス*

0 Comments

Inline Feedbacks

View all comments

Sara

運営者

Contact

書籍やオンライン講座でプログラミングを勉強してフリーランスのプログラマーになりました。
このサイトでは「わかりやすく・シンプル」をモットーに、プログラミングの基礎からアプリ開発まで紹介します。
独学でプログラミングを勉強をしている方、基礎は勉強したけれど次に何をすれば良いか分からない...という方のお役に立てるサイトを目指しています。
>> 詳しいプロフィールはこちら