轻松上手,快乐学习!

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> 标签定义了几个元素的标记:

正确使用带有上述元素的标签将有利于:

  • 屏幕阅读器用户(当用户专注于元素时,将大声读出标签)
  • 单击非常小的区域(如复选框) - 当用户单击 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> 元素:

实例

label {
  cursor: default;
}
亲自试一试 »