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

Question

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

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

有没有不重复的:hover部分？

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

score 15 · Accepted Answer

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

.supposed_to_hover:hover{

}

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

score 6 · Accepted Answer

你不能用一个类吗？

.myHoverClass:hover {
  color: black;
}

然后有一些HTML：

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

score 1 · Accepted Answer

CSS Selectors 4 草案引入了:matches伪类：

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

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

:-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 */ }

score 1 · Accepted Answer

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

您可以将星号选择器用于悬停 -

body *:hover{
    color: red; 
}

4 回答 4