Html 为什么要使用 <label>？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7636502/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why use <label>?
提问by Simplicity
From a presentation perspective, if I write a text between a <label>tag it looks identical as to if I hadn't.
从演示的角度来看，如果我在<label>标签之间写了一段文字，它看起来和我没有写的一样。
So, why do we use this tag at all?
那么，我们为什么要使用这个标签呢？
回答by punkrockbuddyholly
HTML is notabout presentation. It is a way of describing data. If you have some text that represents a label for an input, you wrap it in label tags not for presentation but because that's what it is. Without the label tag, that text is almost meaningless. With the label tag and its forattribute (or not*) you are providing meaning and structure and forming a relationship between your markup that can be better understood by computers/parsers/browsers/people.
HTML与演示文稿无关。它是一种描述数据的方式。如果您有一些文本表示输入的标签，则将其包装在标签标签中不是为了展示，而是因为它就是这样。如果没有 label 标签，该文本几乎毫无意义。使用 label 标签及其for属性（或不*），您提供了含义和结构，并在您的标记之间形成了一种可以被计算机/解析器/浏览器/人更好地理解的关系。
* you don't necessarily need the forif you wrap the label around the input:
*for如果您将标签包裹在输入周围，则不一定需要：
<label>My input
<input type="text" id="my-input" />
</label>回答by Peter Olson
The forattribute of a labelelement corresponds to the idattribute of an inputelement. If you click the label, it puts focus on the input box.
的for一个的属性label元素对应于id一个属性input元素。如果您单击标签，它会将焦点放在输入框上。
Example:
例子：
<input type="checkbox" id="agree" />
<label for="agree">I agree with the Terms and Conditions</label>
If you click on the text, it checks the box.
如果您单击文本，它会选中该框。
回答by Spudley
The HTML <label>tag has one special feature: It allows you to provide a forattribute which links the label to an input field or other control, such that when the user clicks on the label, it is as if he clicked on the control.
HTML<label>标签有一个特殊功能：它允许您提供一个for属性，将标签链接到输入字段或其他控件，这样当用户单击标签时，就好像他单击了控件一样。
eg:
例如：
<label for='mycontrol'>Label text</label> <input type='checkbox' name='mycontrol' id='mycontrol' value='1'>
This would mean that when the user clicks on the 'Label text', the checkbox would be toggled.
这意味着当用户单击“标签文本”时，复选框将被切换。
This is useful for accessibility, general usability, and also allows some tricks such as making a toggle control that doesn't look like a checkbox, but does contain one behind the scenes.
这对于可访问性和一般可用性非常有用，并且还允许一些技巧，例如制作一个看起来不像复选框但在幕后包含一个的切换控件。
But aside from this forfeature, the <label>element is basically the same as any other HTML element.
但除此之外for，该<label>元素与任何其他 HTML 元素基本相同。
If you're not going to use the forattribute, it may still be correct to use a <label>element, for semantic reasons.
如果您不打算使用该for属性<label>，出于语义原因，使用元素可能仍然是正确的。
回答by Mārti?? Briedis
When you click on the label, the focus goes to the related input. Very handy for checkboxes when it is hard to hit the small rectangle.
当您单击标签时，焦点将转到相关输入。当很难点击小矩形时，复选框非常方便。
回答by Kushagra Gour
HTML tags are meant to convey special meaning to users of various categories. Here is what labelis meant for:
HTML 标签旨在向各种类别的用户传达特殊含义。这是什么label意思：
For people with motor disabilities (also for general mouse users)Correctly used
labeltags can be clicked to access the associated form control. Eg. Instead of particularly clicking the checkbox, user can click on more easily clickablelabeland toggle the checkbox.For visually-challenged usersVisually challenged users use screen-readers that reads the associated
labeltag whenever a form control is focused. It helps users to know the label which was otherwise invisible to them.
对于有运动障碍的人（也适用于一般鼠标用户），
label可以单击 正确使用的标签来访问关联的表单控件。例如。用户可以点击更容易点击label并切换复选框，而不是特别点击复选框。对于有视觉障碍的用户 有视觉障碍的用户使用屏幕阅读器，
label只要表单控件获得焦点，就会读取关联的标签。它可以帮助用户了解他们看不到的标签。
回答by Himanshu Kumar
If you don't use tag then you will have to click on the exact tiny circular space to select an option.
如果您不使用标签，则必须单击精确的微小圆形空间以选择一个选项。
But,if you use tag then you will just have to click anywhere on the text(or the tiny circular blank space) to select an option.
但是，如果您使用标签，那么您只需单击文本（或微小的圆形空白区域）上的任意位置即可选择一个选项。
NOTE:-The tag just bound the small circular blank area with the text associated with it. Thats it.
注意：-标签只是将小圆形空白区域与与之关联的文本绑定在一起。就是这样。
回答by Ben van Gompel
From HTML label tag:
"The label element does not render as anything special for the user. However, it provides a usability improvement for mouse users, because if the user clicks on the text within the label element, it toggles the control.
“标签元素不会呈现为用户的任何特殊内容。但是，它为鼠标用户提供了可用性改进，因为如果用户单击标签元素中的文本，它会切换控件。
The for attribute of the tag should be equal to the id attribute of the related element to bind them together."
标签的 for 属性应该等于相关元素的 id 属性，将它们绑定在一起。”
回答by archil
Nothing from presentation point of view. Lable tag is used for defining label for an inputelement. From the semantic point of view, it should not be used for defining text.
从演示的角度来看什么都没有。Lable 标签用于定义输入元素的标签。从语义的角度来看，它不应该用于定义文本。
