向菜单添加悬停效果

【问题标题】：Add hover effects to mmenu向菜单添加悬停效果
【发布时间】：2015-11-12 09:45:26
【问题描述】：

感谢之前对 mmenu 的帮助，我现在可以按我的意愿工作。对我来说，这是一门 CSS 速成课程！但是，我想为 mmenu 添加悬停效果（菜单项的背景会改变颜色）。使用只是一个链接的单级项目执行此操作没有问题，但是如果我将悬停效果应用于打开二级菜单的项目（带有向右箭头的项目），悬停颜色会隐藏文本。有没有使用 CSS 的解决方案？

【问题讨论】：

标签： mmenu

【解决方案1】：

希望这对你有用...

有几种方法可以添加悬停效果。示例是具有 3 个选项的菜单

.mm-listview > li:nth-child(1):hover {
   background-color:#ff6600;
}

.mm-listview > li:nth-child(2):hover {
   background-color:#990066;
}

.mm-listview > li:nth-child(3):hover {
   background-color: #c5215d;
}

当鼠标悬停在上面时，这会改变背景颜色，但这也适用于任何子菜单。

因此，如果您只想定位一个 li，请使用以下设置对其应用一个类。

.menu-customnamegoeshere > :nth-child(1):hover {
   background-color:#00cc99;
}

HTH

【讨论】：