2

我已经这样做了 1000 次,这可能是因为我很沮丧,我无法弄清楚,但是我在更改基于活动页面的导航栏链接的外观时遇到了很多麻烦。

我正在使用 Codeigniter,所以这是我的导航栏代码:

<div id="wrapper">
        <div class="nav">
            <ul>
                <?php if ($this->uri->segment(1) === FALSE) { echo "<li class='active'>"; } else { echo "<li>"; } ?><a href="/">home</a></li>
                <?php if ($this->uri->segment(1) == 'about') { echo "<li class='active'>"; } else { echo "<li>"; } ?><a href="/about">about</a></li>
                <?php if ($this->uri->segment(1) == 'music') { echo "<li class='active'>"; } else { echo "<li>"; } ?><a href="/music">music</a></li>
                <?php if ($this->uri->segment(1) == 'contact') { echo "<li class='active'>"; } else { echo "<li>"; } ?><a href="/contact">contact</a></li>
            </ul>
        </div>
</div>

其次,这里是应该改变链接外观的CSS :

#wrapper .nav ul li .active a {
    color: grey;
    cursor: default;
}

我完全不知道为什么这不起作用。如果有人能如此好心地敲我的脑袋并提醒我为什么我是个白痴,那就太好了。

谢谢。

4

1 回答 1

5

像这样删除了li之前的.active

#wrapper .nav ul .active a {
    color: grey;
    cursor: default;
}

jsFiddle在这里

你正试图为li班级的孩子设计风格.active

或者,您也可以使用:

#wrapper .nav ul li.active a {
    color: grey;
    cursor: default;
}

jsFiddle在这里

...要么工作。

于 2013-09-25T01:16:18.470 回答