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

前端之家收集整理的这篇文章主要介绍了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; }

猜你在找的CSS相关文章