Wordpress 网站上的子菜单不会在悬停时显示

Question

我正在开发一个网站，当您将鼠标悬停在主导航栏中的“参考资料”和“联系我们”项目上时，该网站应该会显示子菜单。但是，这些项目不会显示。

我尝试通过 CSS 向菜单和子菜单项添加悬停属性，但似乎没有任何效果。它似乎总是默认为“显示：none;”对于子菜单。

我不确定从这里该何去何从，如果有 CSS 修复可能是我遗漏的，那么任何指导都会有所帮助！提前致谢！

Answer 1

首先，您需要从 custom.cs（第 1 行）和 style.css（第 844 行）https://prnt.sc/15pru62

中删除以下 css

#nav .sub-menu {
    display: block !important;
}

您还需要从子菜单中删除内联样式（显示：none）https://prnt.sc/15ps03v

之后添加这个 css

#nav li ul.sub-menu {
    display: none;
}

#nav li:hover ul.sub-menu {
    display: block;
}

Answer 2

我能够通过使用我以前没有想到的不同选择器找到解决方案：

#menu-item-5990 a:hover + .sub-menu,
#menu-item-5237 a:hover + .sub-menu {
display: block;
}

Sub-menu's on Wordpress site won't display on hover