在Mozilla html教程中它说
不要在标签内放置锚点或按钮等交互式元素。这样做将使人们难以激活与标签关联的表单输入。
不要
<label for="tac"> <input id="tac" type="checkbox" name="terms-and-conditions"> I agree to the <a href="terms-and-conditions.html">Terms and Conditions</a> </label>做
<label for="tac"> <input id="tac" type="checkbox" name="terms-and-conditions"> I agree to the Terms and Conditions </label> <p> <a href="terms-and-conditions.html">Read our Terms and Conditions</a> </p>
我尝试了这两种方法，并且在第一次使用时找不到任何严重问题，那么"使人们难以激活与标签关联的表单输入"到底是什么意思？
如果您单击"不要"示例中的链接，您将在有机会在该链接和复选框所在的页面上提交表单之前被带到该页面。(不过，我想，从技术上讲，您仍然设法激活了复选框......
不过，HTML实际上并不能阻止您将链接放在标签中。但它确实会阻止您将其他窗体控件放在标签中，特别是如果它们具有 ID 并且标签具有尝试指向另一个控件的for属性(因为标签一次只能与一个控件关联(。
简而言之，单击与复选框或单选按钮关联的标签。通过添加链接，行为变得不稳定，单击标签的一部分做一件事，但在另一件事上做不同的事情。
附带说明一下，与其他字段关联的标签也执行功能。单击这些标签会将焦点转到关联的字段。
一般的经验法则是交互式元素不应嵌套。在这种情况下，label可以被视为交互式字段(尽管特殊情况是标签封装关联元素(。
如果您使用"请勿示例"，用户可能会在尝试勾选复选框时意外单击链接而不是文本。它们将被转发到新页面，同时尝试同意条款。
在其他情况下，您可能还有一个按钮，用户可能会在尝试勾选该框时单击该按钮。
请注意链接/锚点位于复选框和标签下方，而不是与它们内联。它保证用户在与这些项目交互时不会感到困惑。