CSS A Hover排除当前项

Question

我正在尝试使用我支付的这个Wordpress模板，但开发人员没有太多帮助而且我被卡住了......

主导航具有粉红色的悬停功能，但我希望“当前菜单项”在悬停时不会变为粉红色。证明很难找到合适的课程进行编辑。

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

Home

该网站位于以下位置：

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 而不是反对它，但似乎样式表已经大量使用它。< / p>

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标签上将摆脱粉红色并使其与所选项目的蓝色相同。