尝试在鼠标悬停时添加突出显示以在Wordpress中选择下拉菜单

Question

我想在下拉菜单选项中添加鼠标悬停突出显示，因为当前在菜单上我只有一个简单的下拉菜单。 我拥有最新的wordpress版本，并且我正在研究oneengine主题。 我试图从我在Google上找到的一些建议中添加此内容，但是将鼠标悬停完全没有任何反应时，它根本不起作用：

#navigation li:hover a {
  background-color:#012A5E;
  color:#F1F1F1;
}

这是我的style.css中与菜单本身相关的代码：

#main-menu-top ul.sub-menu li a:hover, 
#main-menu-top ul.sub-menu li a:active {
border-left-color:#ccc; border-bottom-color: transparent;
 }
#main-menu-top .sub-menu {
 float: left; position: 
 absolute; display:
 none; padding: 0; 
 text-align: center; 
 border: 1px solid #BDC3C7; 
 border-top: none; 
 background: black; 
 z-index: 9999;
}
#main-menu-top li:hover ul.sub-menu {
display: block;
 }
 #main-menu-top .sub-menu li {
display: block; min-width: 100px;
}
 #main-menu-top .sub-menu li a { padding: 10px 15px;
 }
}

此更改是否也仅需要更改style.css还是我也必须制作一个j.script代码？ 任何帮助都将不胜感激。

Answer 1

您的主题有自定义的CSS页面吗？ 如果是，则在此添加此代码。
nav ul li:hover { background: red;}
如果不可用，请转到“仪表板”->“外观”->“编辑器”，然后选择“样式表（style.css）”文件，并将代码添加到文件末尾。 但这有一个问题。 将来当您更新主题时，可能会丢失所有编辑。 因此，创建子主题以永久保留所有更改是安全的。 请参阅此链接以了解有关儿童主题的更多信息。