Question

我无法使用应用于自定义类的样式来覆盖CSS。我已将类应用于侧边菜单中的链接。这是为了更改当前查看页面的文本颜色。根据我的阅读，我需要在定位链接时更具体，但我尝试的一切都无法正常工作。

HTML：

<div class="left_column">
    <nav class="side_nav">
        <ul>
            <li><a class="current_side" href="contact.html">CONTACT</a></li>
            <li><a href="#">DIRECTIONS</a></li>
            <li><a href="#">CAREERS</a></li>
        </ul>
    </nav>
</div>

CSS：

.left_column{
    float: left;
    width: 10%;
    height: 700px;
    padding-right: 10px;
    background-color: #f5f5f5; 
}
.side_nav{
    width: 125px;  
    padding: 50px 0 0;
}
.side_nav ul, li{
    list-style: none; 
}
.side_nav ul li a{
    display: block; 
    width: 125px;
    line-height: 1.5em;
    font-size: .95em; 
    text-decoration: none;
    text-align: right; 
    color:#666666;
}
.current_side a{
    color: #000000;
}

Answer 1

.current_side a表示＆＃34; a元素，它是作为类current_side成员的元素的后代。

你没有这样的元素。 a元素是该类本身的成员，因此要选择所需的元素a.current_side。

然而，这将是一个类型选择器+一个类选择器，.side_nav ul li a也将匹配元素，但更具体的 3 类型选择器+一个类选择器，所以你还需要使你的选择更具体。

 .side_nav ul li a.current_side

Answer 2

你只需要.current_side {}，因为它是一个元素。

Answer 3

在定位元素时，您需要更加具体：

.side_nav ul li a.current_side {
    color: #000000;
}

自定义类不会覆盖CSS

3 个答案: