WordPress中每个活动菜单项的不同颜色答案

【问题标题】：Different colors for each active menu item in WordPressWordPress中每个活动菜单项的不同颜色
【发布时间】：2018-07-23 19:20:24
【问题描述】：

我在 WordPress 网站上有一个包含 4 个项目的菜单 - 家 - 文件夹 - 团队 - 连接

我想突出显示正在访问的当前页面的菜单项，但每个页面应该有不同的颜色。例如，如果我访问主页，主页菜单项应该是绿色的。

如果我访问投资组合页面，那么投资组合菜单项应该是绿色的。

【问题讨论】：

【解决方案1】：

我找到了解决方案。由于主题基于 Twitter Bootstrap，因此将一个 .active 类添加到正在访问的当前页面的菜单项中。因此，我为主页添加了一个单独的类，例如 .home，.portfolio 到投资组合页面，然后 链接类 使其生效。

.navbar-nav > .home.active > a {
    color: green !important;
}

注意 .home.active 类是链式的。

关注 SO 的主题很有帮助。

【讨论】：

【解决方案2】：

你可以这样使用

ul li.active:first-child {
  color:blue;
}

ul li.active:nth-child(2) {
    color: red;
}


ul li.active:nth-child(3) {
    color: green;
}

【讨论】：