为什么`{label>`在`<a>` tag disable the cursor pointer

Question

Look at the following jsfiddle内。我在Bundle标记下嵌套了不同的标记，当我将鼠标悬停在它们上面时，它们都将光标保持在指针状态，除非嵌套元素是<a>。

为什么会这样？ <label>的默认悬停状态是否为<label>？

Answer 1

  

<label>的默认悬停状态是否为cursor: default？

悬停伪类是无关紧要的。 cursor属性本质上与“当指针指向它时”相关联......但除此之外：是

可能值得指出您的HTML无效。禁止在其他交互元素（如<label> s）中放置交互元素（如<a> s）。

Answer 2

是肯定的。这里说的很清楚

http://www.w3schools.com/TAgs/tag_label.asp

从该页面开始：

大多数浏览器都会显示具有以下默认值的元素：

实施例 标签 {     cursor：default; }

并且很容易在chrome dev工具中验证。

Answer 3

您不应该在label标记内包含a。 cursor由用户代理样式表设置。如果你仔细检查DOM，你会看到

因此，如果要设置cursor: pointer;，则需要使用\

专门覆盖用户代理声明

a label {
  cursor: pointer;
}

OR

label {
  cursor: pointer;
}

  

注意：我不建议您这样做。在语义上它没有任何意义   将label放入a标记内。 label通常用于   focus中的form个文字字段。它们是一种行动元素   就像a标签一样。

Answer 4

首先，在元素中允许使用哪些元素存在限制。

XHTML - What elements are allowed within the <a> element?

其次，yes label元素具有默认属性：

cursor: default