无论如何不要重复“：悬停”？

Question

当鼠标悬停时，我有很多具有相同规则的元素。

h2:hover,h1:hover,p:hover,a:hover,h5:hover,h3:hover{...}

有没有不重复:hover部分？

更具体地说，有没有什么方法可以在不重复psuedo类的情况下向多个元素添加伪类（:hover）？

Answer 1

给他们所有相同的类名，并在类名上调用hover：event。

.supposed_to_hover:hover{

}

（您也可以使用jQuery选择所有元素，然后调用它们上的.hover()！）

Answer 2

你能不能上课？

.myHoverClass:hover {
  color: black;
}

然后有一些HTML：

<h1 class="myHoverClass">Heading!</h1>
<a class="myHoverClass" href="http://www.google.com">Link!</a>

Answer 3

参考上面的评论：我希望此代码适用于所有元素

您可以将asterisk selector悬停为 -

body *:hover{
    color: red; 
}

Fiddle

Answer 4

CSS选择器4草案introduces :matches伪类：

:matches(h1, h2, h3, h5, p, a):hover {...}

目前，在Gecko和Webkit中，草案的旧版本有实验性实现，称为any()：

:-webkit-any(h1, h2, h3, h5, p, a):hover {...}
:-moz-any(h1, h2, h3, h5, p, a):hover {...}

但是它们的用例非常有限（例如，用于开发特定浏览器或iOS / FirefoxOS特定移动应用程序的扩展）因为它不需要更多代码重复，因为您无法组合这些选择器：

:-webkit-any(...), :-moz-any(...) { /* this won't work anywhere */ }