CSS多类选择器控制:悬停效果

Question

我有一个带有：hover伪类的div，它应用许多CSS效果来向用户指示他们正在悬停在上面。

当用户通过添加.disable类悬停在CSS上时，如何禁用CSS效果？

http://jsfiddle.net/nQUSn/1/

Answer 1

适用于除IE<9:

将.a:hover {更改为.a:not(.disable):hover {

Answer 2

您可以创建一个选择器a.disable:hover来重置该锚点元素上的样式。例如，如果你的a:hover css是：

a:hover {
    color: red;
}

链接的颜色通常是蓝色，你禁用的CSS可能看起来像：

a.disable:hover {
    color: blue;
}

Answer 3

无需使用".disable"类。您可以将:disabled伪类与:hover伪类链接：

elem {
  color : blue;
}
elem:hover {
  color : lightblue;
}
elem:disabled, elem:disabled:hover {
  color : grey;
}