我有一个CSS文本颜色问题

Question

是的，所以我已经指定了默认链接为某种颜色(颜色：#696(，我希望这能将所有未指定的链接都变成这种颜色，但问题是，我有一个菜单栏，在这个菜单栏上，我有类为navtn的项目，这些navtn具有#90F的颜色，但即使我指定了该类的颜色，主体的链接颜色仍然是父的，

我希望navbtn的文本颜色为#90F，而不是我指定的#696。我的CSS:

a:link {
    color: #696;
    font-weight: bold;
}
a:visited {
    color: #0C3;
}
--
.navbtn {
    display: block;
    width: 198px;
    height: 35px;
    float:left;
    border-left: 1px solid #CCC;
    border-right: 1px solid #CCC;
    text-align: center;
    line-height: 35px;
    font-size: 18px;
    background-image: url(../global-images/navbtnbg.png);
    color: #09F;
    text-decoration: none;
    font-weight: bold;
}

Answer 1

我建议您应该让选择器更具体：

a:link.navbtn {
    /* styles for the .navbtn class */
}

可能还值得为:visited、:hover、:active和:focus样式添加样式。

a:visited.navbtn {
    /* styles for visited-.navbtn class links */
}

值得注意的是，您实际的html可能也有影响，但我不能在没有看到它的情况下对此发表评论。

Answer 2

.navbtn {
    display: block;
    width: 198px;
    height: 35px;
    float:left;
    border-left: 1px solid #CCC;
    border-right: 1px solid #CCC;
    text-align: center;
    line-height: 35px;
    font-size: 18px;
    background-image: url(../global-images/navbtnbg.png);
    color: #09F !important;
    text-decoration: none;
    font-weight: bold;
}

添加！重要的

Answer 3

a的规则比.navbtn的规则更具体，因此它将优先于.navbtn规则。如果您创建了一个新的样式规则，例如.navbtn a:link、.navbtn a:hover等等，那么它应该会给您带来您想要的结果。

Answer 4

试试这个：

.navbtn {
    display: block;    
    width: 198px;    
    height: 35px;    
    float:left;    
    border-left: 1px solid #CCC;    
    border-right: 1px solid #CCC;    
    text-align: center;
    line-height: 35px;    
    font-size: 18px;    
    background-image: url(../global-images/navbtnbg.png);        
    text-decoration: none;    
    font-weight: bold;
}
a:link {    
    color: #696;    
    font-weight: bold;}
    a:visited {color: #0C3;}
.navbtn a{
    color: #09F!important;
}