css – 覆盖：访问覆盖：link：hover：active

请考虑这些风格：

a:link { color: blue }
a:visited { color: red }
a:hover { color: green }
a:active { color: black }
#special:link { color: pink }

现在这个标记：

<a href="#">normal link</a>
<a href="#" id="special">Special link</a>

我期待“特殊”链接成为粉红色,同时保持其他颜色.但是,粉红色替代了其他颜色.

为什么会发生这种情况？我该如何解决？谢谢.

解决方法

我相信它与CSS priority订单有关.

因为#special是一个ID,所以它应用于任何元素级风格. (这可以在Firefox Firebug / Chrome Inspector中被证明,以及继承的样式表是否被ID的风格覆盖).

虽然,考虑到没有“现在的风格”适用于：主动,被访问等.这将会导致这些风格仍然不受影响.然而,对您的悬停进行以下更改似乎踢回来：

a:hover { color: green !important; }