แท็ก <label> ใช้ใส่ป้ายกำกับให้ฟอร์มคอนโทรล เช่น text, textarea, checkbox, radio เพิ่ม accessibility และ UX (คลิก label จะโฟกัสช่องกรอก)
แอตทริบิวต์สำคัญ
| แอตทริบิวต์ | ค่า | คำอธิบาย |
|---|---|---|
| for | control id | ต้องตรงกับ id ของ input control ที่เกี่ยวข้อง |
| form | form_id | ระบุ form ที่ label ผูกมอง (HTML5) |
ตัวอย่าง
<!DOCTYPE html> <html> <head> <title>HTML label Tag</title> </head> <body> <label for="email">EMAIL-ID:<br /> <input type="email" id="email" name="emailid" size="30" placeholder="Enter a valid email address"> <br /><br /> <label for="phone">PHONE NO:<br /> <input type="text" id="phone" name="phno" size="30" maxlength="10" placeholder="Enter a valid phone number" pattern="[0-9]{10}"> <br /><br /> </body> </html>
แอตทริบิวต์ for ต้องตรงกับ id ของ input ทุกครั้ง เพื่อความเข้าถึงได้ (accessibility) และการทำงานของเบราว์เซอร์ที่ถูกต้อง
