CSS链接颜色样式覆盖

时间:2013-05-11 18:36:03

标签: html css colors hyperlink styles

我非常生气!我希望有人可以添加一个很好的提示如何解决这个问题。

所以...我创建了2个div,在这两个div里面是一个不同颜色的LINK。一切都工作正常,但当我改变第二个链接颜色,覆盖我的第一个链接...几乎每次我遇到这个问题...

我的css代码:

.button a, a:link, a:visited { text-decoration:none; font-size:12px; color:#FFF; }
.button a:hover { cursor:pointer; color:#FFF; }

.post-share-comment a, a:link, a:visited { font-size:12px; color:#000; }
.post-share-comment a:hover { cursor:pointer; }

我的.button链接颜色是白色但在网络上不是...在网络上是黑暗的...当我在.button上添加这个post-share-comment div比我的按钮是白色但是其他链接也是白色...所以第二种风格会覆盖第一种 ???为什么是这样 ???

谢谢!!!!

1 个答案:

答案 0 :(得分:2)

逗号分解完整的选择器,而不是它们的组件

此:

 .post-share-comment a, a:link, a:visited {}

意思是:

 .post-share-comment a {}
 a:link {}
 a:visited {}

 .post-share-comment a {}
 .post-share-comment a:link {}
 .post-share-comment a:visited {}

你的选择器应该是:

 .post-share-comment a,
 .post-share-comment a:link,
 .post-share-comment a:visited {}

如果您不想写出完整的语法,那么您可以使用LESS之类的预处理来允许:

 .post-share-comment {
     a,
     a:link,
     a:visited {}
 }