css - CSS a:hover 奇怪地继承了样式

Question

我意识到，如果我在 CSS 中设置链接的样式，则使用具有类名的父元素，即：

div.class a { ... }

链接的悬停状态也继承了这个样式表，但前提是我规定了一个特定的类。

JSFiddle

如何在不重复 :hover 样式表的情况下解决这个问题？

Answer 1

您可以使用!important悬停样式。

a:hover {color:#d00 !important;}

Answer 2

选择器div.div a比选择器更具体a:hover，所以它会优先。

如果您使悬停选择器更具体，它也将用于最后一个 div。例如：

html body a:hover {color:#d00;}