如何根据您所在的页面更改导航栏中超链接的颜色？

Question

对于这个例子，我们只说一个导航栏包含元素：

cats - dogs - sheep - cows

我想这样做，如果您在cats页面上，cats文字为红色，但其余文字为白色，如果您在dogs页面上，则{{ 1}}变蓝等等？

Answer 1

创建一个类（比如.active）并将其分配给每个页面上的活动标记（cats标记将在cats页面上获得活动类）。你的代码看起来像这样：

<强> HTML

<a class="active">cats</a>
<a href="dogs.html">dogs</a>
<a href="sheep.html">sheep</a>
<a href="cows.html">cows</a>

<强> CSS

a {
    color: white;
}

a.active {
    color: red;
}

修改：如果您希望每个活动页面都有不同的颜色，那么您也可以使用内联CSS。

<a style="color:red">cats</a>
<a href="dogs.html">dogs</a>
<a href="sheep.html">sheep</a>
<a href="cows.html">cows</a>