HTML <label> 标签
实例
三个带标签的单选按钮:
<form action="/action_page.php">
<label for="male">Male</label>
<input type="radio" name="gender" id="male" value="male"><br>
<label for="female">Female</label>
<input type="radio" name="gender" id="female" value="female"><br>
<label for="other">Other</label>
<input type="radio" name="gender" id="other" value="other"><br><br>
<input type="submit" value="提交">
</form>
亲自试一试 »
<label for="male">Male</label>
<input type="radio" name="gender" id="male" value="male"><br>
<label for="female">Female</label>
<input type="radio" name="gender" id="female" value="female"><br>
<label for="other">Other</label>
<input type="radio" name="gender" id="other" value="other"><br><br>
<input type="submit" value="提交">
</form>
定义和用法
<label> 标签定义了几个元素的标记：
- <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> | Yes | Yes | Yes | Yes | Yes |
属性
| 属性 | 值 | 描述 |
|---|---|---|
| for | element_id | 规定 label 与哪个表单元素绑定。 |
| form | form_id | 规定 label 字段所属的一个或多个表单。 |
全局属性
<label> 标签支持 HTML 中的全局属性。
事件属性
<label> 标签支持 HTML 中的事件属性。
相关页面
HTML DOM 参考手册: Label 对象
默认CSS设置
大多数浏览器将使用以下默认值显示 <label> 元素:
