html中label标签的用法？html基础语法

编程之家2026-06-29650次浏览

大家好，今天来为大家解答html中label标签的用法这个问题的一些问题点，包括html基础语法也一样很多人还不知道，因此呢，今天就来为大家分析分析，现在让我们一起来看看吧！如果解决了您的问题，还望您关注下本站哦，谢谢~

Label中有两个属性是非常有用的,一个是FOR、另外一个就是ACCESSKEY了。

FOR属性

功能：表示Label标签要绑定的HTML元素，你点击这个标签的时候，所绑定的元素将获取焦点。

用法：<Label FOR="InputBox">姓名</Label><input ID="InputBox" type="text">

ACCESSKEY属性：

功能：表示访问Label标签所绑定的元素的热键，当您按下热键，所绑定的元素将获取焦点。

用法：<Label FOR="InputBox" ACCESSKEY＝"N">姓名</Label><input ID="InputBox" type="text">

局限性：accessKey属性所设置的快捷键不能与浏览器的快捷键冲突，否则将优先激活浏览器的快捷键。

注释

要将 LABEL绑定到其它的控件，请将 LABEL元素的 FOR属性设置为与该控件的 ID相同。将 LABEL绑定到控件的 NAME属性毫无用处。但是，要提交表单，你必须为 LABEL元素所绑定到的控件指定 NAME。

有两种方法给所指定的快捷键添加下划线。LABEL元素的 rich text支持可以在 ACCESSKEY属性所指定的快捷键字符两侧加上 U元素。如果你更愿意使用样式表(CSS)来应用样式，可以将该字符包含在 SPAN中，并设置样式为“text-decoration: underline”。

如果用户单击 LABEL，则会先触发 LABEL上的 onclick事件，然后触发由 htmlFor属性所指定的控件上的 onclick事件。按下 LABEL设定的快捷键将设置焦点但并不触发 onclick事件。

标签不允许嵌套。

此元素在 Internet Explorer 4.0及以上版本的 HTML和脚本中可用。

此元素是内嵌元素。

此元素需要关闭标签。

元素示例代码

下面的例子使用了 LABEL元素和 ACCESSKEY属性设置文本框的焦点。

This example uses the LABEL element and the ACCESSKEY attribute to set focus on a text box.

Html代码

1.<LABEL FOR="oCtrlID" ACCESSKEY="1">

2.

3.</LABEL>

4.<INPUT TYPE="text" NAME="TXT1" VALUE="binding sample 1"

5.SIZE="20" TABINDEX="1" ID="oCtrlID">

label标签主要是方便鼠标点击使用，增强用户操作体验。

1、新建html文件，在网页中设置一个性别选项，这时当用户点击性别后面的小圆点才能选择性别，由于小圆点区域比较小，想准确点击比较麻烦，所有用户体验不好：

2、为两个选项分别设置“id”属性，男性属性值为“male”，女性属性值为“female”：

3、为“男”和“女”文字都添加上“label”标签，标签属性“for”的属性值分别为“male”和“female”，这时用户点击“男”和“女”文字时也会选中对应的选项，提高了用户体验。除了单选框之外，多选框、文本框等标签也同样可以用label标签选中：

其实主要是 Label中有两个属性是非常有用的,一个是FOR、另外一个就是ACCESSKEY了。