Question

大家好，我为我的网站做了导航。我只想在转到另一页时改变链接的颜色。例如，我单击“关于”然后我将转到关于页面我喜欢当我在关于页面时关于链接将变为红色。

我该怎么做？谢谢！

这里是代码

HTML

<nav> 
    <ul>
        <li><a href="index.htm">Home</a></li>
        <li><a href="about.htm">About</a></li>
        <li><a href="#">Services</a></li>
        <li><a href="#">Creatives For Less</a></li>
        <li><a href="#">Blogs</a></li>
        <li><a href="#">Contact</a></li>
    </ul>
</nav>

CSS：

nav {
    float: right;
    margin-top: 13px;
    margin-right: 40px;
}

nav ul {
    font-family: josefin;
    list-style-type: none;
    font-size: 11pt;
    text-transform: uppercase;
}

nav li {
    display: inline;
    padding-left: 15px;

}

nav li a{
    text-decoration: none;
    color: #0ff;
}

nav li a:hover, a:active {
    color: #fff;
}

Answer 1

只需拥有一个active课程，如果您在某个页面上，请将<li>设置为该课程。

例如：

<li class="active"><a href="#">Services</a></li>

在您的CSS样式中active类：

nav li.active a{
    color: red;
}

如果您问如何知道自己所在的页面，并且想要动态地执行此操作，则需要使用PHP，其他一些服务器端语言或JavaScript。

Answer 2

您可以使用javascript或某些服务器端语言添加一些css类。

如果你要使用javascript，你应该找到一些东西，表明你的用户在页面上（例如某些div有信息）。然后，如果您使用JQuery，请添加此类：

$('#mylink').addClass('active');

Answer 3

在CSS中使用a：visited。

答：访问 { 背景颜色：黄色; }

您应该查看为它们设置类，然后通过css

分配它们

导航栏当前状态

3 个答案: