Html :hover 但 :not on a specific class
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9241692/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
:hover but :not on a specific class
提问by Jürgen Paul
How do I apply a hover effect on an aelement, but not to an aelement with the class active?
如何在a元素上应用悬停效果，而不是对a具有 class的元素应用active？
a:hover(not: .active)
Seems something is missing.
好像少了点什么。
回答by BoltClock
The functional notation is on :not(), not :hover:
功能符号是 on :not()，不是:hover：
a:not(.active):hover
If you prefer to put :hoverfirst, that's fine:
如果你喜欢:hover放在第一位，那很好：
a:hover:not(.active)
It doesn't matter which pseudo-class comes first or last; either way, the selector works the same. It just happens to be my personal convention to put :hoverlast as I tend to place user-interaction pseudo-classes behind structural pseudo-classes.
哪个伪类先出现或最后出现并不重要；无论哪种方式，选择器的工作方式都是一样的。:hover因为我倾向于将用户交互伪类放在结构伪类之后，所以它恰好是我个人的习惯放在最后。
回答by Mendhak
You have the option of using the not()selector.
您可以选择使用not()选择器。
a:not(.active):hover { ... }
However, this may not work in all browsers, as not all browsers implement CSS3 features.
但是，这可能不适用于所有浏览器，因为并非所有浏览器都实现 CSS3 功能。
If you are targeting a large audience and want to support older browsers, the best way would be to define a style for the .active:hoverand undo whatever you're doing in a:hover.
如果您的目标是大量受众并希望支持较旧的浏览器，最好的方法是为 定义样式.active:hover并撤消您在a:hover.
