Question

是的，所以我已经指定默认链接是某种颜色（颜色：＃696），我希望这可以将所有未指定的链接变成颜色，但问题是，我有一个菜单栏，并在此菜单栏上我拥有navbtn类的项目，这些navbtns的颜色为＃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;
}

我有CSS文本颜色问题

4 个答案: