MDN wants to learn about developers like you: https://qsurvey.mozilla.com/s3/MDN-dev-survey

HTML <label>元素表示用户界面中项目的标题。

它通常关联一个控件,或者是将控件放置在label元素内,或者是用作其属性。这样的控制称作label元素的labeled control 。

属性

该元素包含 全局属性.

accesskey HTML 4 HTML5
从键盘访问该元素的快捷键。
for
可标记的 form相关元素的ID,在同一文档中作为label元素。 第一个这样的元素在文档中有一个ID匹配属性值,作为这个label元素的labeled control
注意: label元素可同时有属性和包含控件元素(contained control element),只要此属性指向包含控件元素。
form HTML5
 表示label元素关联的form元素(它的表单拥有者)。此属性值必须是同一文档中<form> 元素的ID。如果未指定此属性值,<label>元素必须是<form>元素的后代。应用此属性值,你可以将label元素放置在文档的任何位置,而不仅仅是作为它的拥有者<form>元素的后代。 

示例

简单的label元素示例

<label>Click me <input type="text" id="User" name="Name" /></label>

使用 label  "for" 属性 bind input "id"

<label for="User">Click me</label>
<input type="text" id="User" name="Name" />

规范

规范 状态 备注
HTML Living Standard
<label>
Living Standard  
HTML5
<label>
Recommendation  
HTML 4.01 Specification
<label>
Recommendation  

浏览器兼容性

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support (Yes) (Yes) (Yes) (Yes) (Yes)
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support (Yes) (Yes) (Yes) (Yes) (Yes)

注意

多个嵌套<label> 元素的click事件

从Gecko 8.0 (Firefox 8.0 / Thunderbird 8.0 / SeaMonkey 2.5)起,冒泡(bubbling)click事件至多在一个<label>上触发,而合成(synthetic)click事件不能在<label>中触发。在Gecko中,一个click事件仍会在冒泡时穿过<label>元素;而在Webkit或IE中,click事件会在<label>标签处被阻止。Gecko 8.0之前的行为(在多个<label>上触发)曾导致Firefox停止响应(参见bug 646157)。

另请参阅

文档标签和贡献者

标签: 
 此页面的贡献者: yinsang, xgqfrms-GitHub, TooBug, ObooChin, JulieLee77
 最后编辑者: yinsang,