CSS 悬停排除当前项目

Question

我正在尝试使用我付费购买的这个 Wordpress 模板，但开发人员没有太大帮助，我被困住了......

主导航具有粉红色的悬停功能，但我希望将"当前菜单项"排除在悬停时变为粉红色。事实证明，很难找到合适的类进行编辑。

我可以看到下面的HTML和CSS样式...

家

该网站位于以下位置：

http://www.royalteeapparel.co.uk/wp

谢谢

Answer 1

添加以下内容：

.menu-item a:hover {color: #FF17A6 !important;}
/* add this */
.current-menu-item a:hover {color: #4AB1D3 !important;}

我还建议您尽量不使用!important并使用CSS而不是反对它，但样式表似乎已经大量使用它。

Answer 2

在您的.css文件中http://www.royalteeapparel.co.uk/wp/wp-content/themes/WhiteNoise/style.css 452行，

改变

.menu-item a:hover {
    color: #FF17A6 !important;
}

任何颜色都适合您的需求。

Answer 3

您还可以包含此行。

.sf-menu li.current-menu-item a:hover
{
    color: #4AB1D3;
}

CSS 文件已包含：

.sf-menu li.current-menu-item a
{
    color: #4AB1D3;
}

因此，向其添加附加行以在 a 标签上包含 ：hover 将去除粉红色并使其与所选项目相同的蓝色。