Thẻ HTML <label>
Thí dụ
Ba nút radio có nhãn:
<form action="/action_page.php">
<input type="radio" id="html" name="fav_language" value="HTML">
<label for="html">HTML</label><br>
<input type="radio" id="css" name="fav_language"
value="CSS">
<label for="css">CSS</label><br>
<input type="radio"
id="javascript" name="fav_language" value="JavaScript">
<label for="javascript">JavaScript</label><br><br>
<input type="submit" value="Submit">
</form>
Định nghĩa và Cách sử dụng
Thẻ <label>xác định nhãn cho một số phần tử:
- <input type = "checkbox">
- <input type = "color">
- <input type = "date">
- <input type = "datetime-local">
- <input type = "email">
- <input type = "file">
- <input type = "month">
- <input type = "number">
- <input type = "password">
- <input type = "radio">
- <input type = "range">
- <input type = "search">
- <input type = "tel">
- <input type = "text">
- <input type = "time">
- <input type = "url">
- <input type = "week">
- <meter>
- <quy trình>
- <select>
- <textareosystem
Việc sử dụng hợp lý các nhãn với các yếu tố trên sẽ mang lại lợi ích:
- Người dùng trình đọc màn hình (sẽ đọc to nhãn khi người dùng tập trung vào phần tử)
- Người dùng gặp khó khăn khi nhấp vào các vùng rất nhỏ (chẳng hạn như hộp kiểm) - bởi vì khi người dùng nhấp vào văn bản trong
<label>phần tử, nó sẽ chuyển đổi đầu vào (điều này làm tăng diện tích lần truy cập).
Mẹo và lưu ý
Mẹo: Thuộc tính for của <label>
phải bằng thuộc tính id của phần tử liên quan để liên kết chúng với nhau. Một nhãn cũng có thể được liên kết với một phần tử bằng cách đặt phần tử vào bên trong <label>phần tử.
Hỗ trợ trình duyệt
| Element | |||||
|---|---|---|---|---|---|
| <label> | Yes | Yes | Yes | Yes | Yes |
Thuộc tính
| Attribute | Value | Description |
|---|---|---|
| for | element_id | Specifies the id of the form element the label should be bound to |
| form | form_id | Specifies which form the label belongs to |
Thuộc tính toàn cầu
Thẻ <label>cũng hỗ trợ Thuộc tính chung trong HTML .
Thuộc tính sự kiện
Thẻ <label>cũng hỗ trợ Thuộc tính sự kiện trong HTML .
Các trang liên quan
Tham chiếu DOM HTML: Đối tượng Nhãn
Cài đặt CSS mặc định
Hầu hết các trình duyệt sẽ hiển thị <label>phần tử với các giá trị mặc định sau:
Thí dụ
label {
cursor: default;
}