HTML <label> 标签
示例
Three radio buttons with labels:
<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>
定义和用法
The <label> tag defines a label for several elements:
- <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>
- <progress>
- <select>
- <textarea>
正确使用具有上述元素的标签将受益：
- 屏幕阅读器用户（当用户专注于元素时，将大声读出标签）
- 难以点击非常小的区域（例如复选框）的用户 - 因为当用户点击
<label>元素中的文本时，它会切换输入（这会增加点击区域）。
提示和注意事项
提示： <label> 的 for 属性必须等于相关元素的 id 属性才能将它们绑定在一起。 也可以通过将元素放置在 <label> 元素中来将标签绑定到元素。
浏览器支持
| Element |
|
|
|
|
|
|---|---|---|---|---|---|
| <label> | Yes | Yes | Yes | Yes | Yes |
属性 Attributes
| 属性 | 值 | 描述 |
|---|---|---|
| for | element_id | 指定标签应绑定到的表单元素的 id |
| form | form_id | 指定标签属于哪个表单 |
全局属性
<label> 标签支持 HTML 中的全局属性。
事件属性
<label> 标签支持 HTML 中的事件属性。
默认 CSS 设置
大多数浏览器将显示具有以下默认值的 <label> 元素：
label {
cursor: default;
}