HTMLのラベルタグ
- 24-07-2022
- Trung Minh
- 0 Comments
この記事では、HTMLでlabelタグを使用する方法を紹介します。これは、フォーム内のオブジェクトのラベルを作成するために使用されるタグです。
1.ラベルタグとは何ですか?
htmlのlabelタグには、入力タグを説明するラベルを設定する効果があります。本質的に、ラベルタグはユーザーにとって特別なものを何も表示しません。ただし、ラベルタグ内のコンテンツをクリックすると、マウスポインタはラベルタグが表す要素に自動的にジャンプします。
<label for="id"></label>
注:labelタグのfor属性は、それが表す入力タグのIDと同じである必要があります。
スパンタグ、pタグ、またはその他のタグを使用して、ラベルタグを囲むことができます。 CSSを使用して外観をカスタマイズすることもできます。
2.HTMLでラベルタグを使用する方法
たとえば、labelタグを使用して、入力タグのラベルを作成します。
<!DOCTYPE html> <html> <head> <title>Học lập trình miễn phí tại web888.vn</title> <meta charset="utf-8"> </head> <body> <h1>Học lập trình miễn phí tại web888.vn</h1> <form action="/action_page.php"> <label>Name:</label> <input type="text" name="name"><br /> <label>Email:</label> <input type="text" name="email"><br /> </form> </body> </html>
3.ラベルのfor属性.tag
すでに述べたように、labelタグのfor属性には、それが表す入力タグを指す効果があります。その値はその入力タグのIDと一致する必要があり、ラベルをクリックすると、カーソルが自動的に入力タグにジャンプします。
例: labelタグのfor属性を使用します。
<!DOCTYPE html> <html> <head> <title>Học lập trình miễn phí tại web888.vn</title> <meta charset="utf-8"> </head> <body> <h1>Học lập trình miễn phí tại web888.vn</h1> <form action="/action_page.php"> <label for="name">Name:</label> <input type="text" id="name" name="name"><br /> <label for="email">Email:</label> <input type="text" id="email" name="email"><br /> </form> </body> </html>