是否应该在带有或不带有 :hover 伪类的规则中设置游标属性？答案

【问题标题】：Should the cursor property be set in a rule with or without the :hover pseudo-class?是否应该在带有或不带有 :hover 伪类的规则中设置游标属性？
【发布时间】：2011-07-17 22:42:54
【问题描述】：

假设你或我编写了一个 HTML 元素...

<a id='hydrogen' href='#'>H</a>

...还有一些:hover CSS...

#hydrogen:hover {
  background:red;
}

...现在我们想在悬停时放置一个花哨的手形光标。有两种选择：

应用于无状态元素：

#hydrogen { 
  cursor:pointer;
}

或者，应用于 :hover 状态。

#hydrogen:hover { 
  color:red;
  cursor:pointer;
}

我的问题：有没有任何理由为什么一种方法比另一种方法更好？

...还是番茄，番茄？

【问题讨论】：

标签： css css-selectors semantics

【解决方案1】：

兼容性：IE6 及以下版本只能识别a 元素上的:hover 伪类。

【讨论】：

【解决方案2】：

它们都是一样的，只要你总是想要pointer，不用担心悬停。

:hover 伪类will inherit cursor: pointer from its non hovered state。

我宁愿把它放在普通选择器上，而不是:hover。

【讨论】：

非悬停状态不是由缺少:hover 伪类来表示，而是由:not(:hover) 明确表示。这就是问题称之为“无状态”的原因，也是应用该样式的原因。

【解决方案3】：

两种方式都一样好。但是，如果元素不是锚点，我会将它放在 id 本身上，因为 :hover 不适用于 ie6 或更低版本。如果你不关心旧版本的 IE。那么这两种方式都是正确的。

【讨论】：