我知道您可以同时使用这两种方法，但使用其中一种会更好吗？如果是这样，为什么？
“for”属性示例：
<input type="text" id="male"><label for="male">Male</label>
包装示例：
<label>Age:<input type="text"></label>
问问题
32601 次
8 回答
38
从语义上讲，这两种可能性是相同的。但根据您想要的布局，这两种可能性各有利弊。例如，如果您希望标签位于完全不同的位置，则将输入放入标签中没有任何意义。但是，如果您希望能够通过 css 制作悬停效果，例如为标签和输入周围区域设置背景，最好将输入放入标签中。
于 2012-08-16T17:02:03.377 回答
22
根据 http://www.w3.org/TR/2008/WD-WCAG20-TECHS-20080430/H44.html
一些辅助技术不能正确处理隐式标签
所以当你换行时，你可能还想为标签元素提供“for”属性。
于 2015-07-08T19:54:28.357 回答
7
wrap 允许删除for属性，这反过来又允许省略输入元素上的 `id' 属性。非常适合需要在页面上的多个实例中使用的模板或任何表单。
于 2013-06-24T09:29:12.563 回答
2
没关系。两者在定义标签和字段之间的关系方面完成了相同的事情。
于 2012-08-16T16:57:55.853 回答
1
在标签中嵌入输入也会影响包装行为。 <label><checkbox/>Value with spaces</label>默认情况下将包装为一个单元。而<checkbox id="check"/><label for="check">Value with spaces</label>将用空格换行文本并将标签换行，但保留上面的复选框。
于 2014-05-10T05:13:19.693 回答
0
如果它很重要，那么像 ASP.NET 这样的框架会将元素放在//label元素旁边并使用's属性。inputselecttextarealabelfor
于 2012-08-16T17:01:49.317 回答
0
使用语法时，这种关系会更明确地定义for，尽管我相信大多数浏览器对两者都实现了相同的行为。
我认为这是一个偏好问题。就我个人而言，我会使用for语法，因为我认为它比input元素成为其label元素的一部分更具有语义意义。
于 2013-01-01T20:22:33.560 回答
0
'label for' 语法意味着您创建的标签旨在成为 id 为 'inp' 的输入的标签。如果您在大多数浏览器中单击此标签，则光标焦点将落在“inp”输入元素上。这是将标签与其相应的表单控件链接起来的一种很好的小方法。
我不知道兼容性问题或任何有关性能的问题。对我来说，它在语法上似乎是合理的，据我所知，CSS 规范声称两者都是有效的。
于 2013-01-01T20:17:03.337 回答