css - 背景颜色 Slicknav 响应式菜单的悬停问题

Question

我在使用 slicknav 响应式菜单时遇到问题，如果导航按钮为样式表中的悬停设置了不同的背景颜色，如果您将鼠标悬停在实际标签文本上，则背景颜色会正确更改，但是如果您将鼠标悬停在按钮远离文本，则实际文本后面的颜色不会改变。因此，您会在原始颜色的文本周围得到一个相当丑陋的框。这发生在所有经过测试的浏览器中。

我找不到任何方法来阻止这种情况的发生，css 文件并不复杂。我现在在几个网站上使用过 Slicknav 并且总是遇到同样的问题，但这次我真的需要修复它。

你可以在这里看到一个例子：http: //www.yorkluxuryholidays.co.uk/

在响应模式下，将鼠标悬停在具有子菜单的菜单项之一上，但不能直接悬停在菜单文本本身上，并且文本后面的区域不会改变颜色。

这是我用于悬停的 css：

.slicknav_nav .slicknav_item:hover {
background:#59584e;
color:#fff; }
.slicknav_nav a:hover{
background:#59584e;
color:#fff;}

您在哪个类上设置颜色似乎没有区别，或者两者都没有，行为完全相同。

我很想知道是否有办法用css解决这个问题！

Answer 1

添加你的CSS：

.slicknav_nav a:hover * {
    color:#fff;
    background-color:#7b9fc7;
}