css - 如何防止我的整个盒子在悬停时变白

Question

我希望有人能花点时间看看我的响应式网页，让我知道我需要编写什么 CSS 规则来防止处于菜单折叠状态的框在悬停时完全变白。我在下面看不到我的白色 txt 链接。我试过这条规则，但没有成功:

.nav-collapse .nav > li > a, .nav-collapse .dropdown-menu a:hover {
    text-decoration:none;
}

如果您调整浏览器的大小直到顶部导航栏折叠起来，当您打开折叠的菜单并悬停鼠标时，您就会明白我的意思。

Page I'm creating is here:

使用 tw bootstrap - 任何帮助将不胜感激。

谢谢

Answer 1

您需要为适当的媒体查询覆盖样式。要仅在菜单折叠时定位菜单，您可以执行以下操作:

@media (max-width: 979px) {
    .nav-collapse .nav > li > a:hover, .nav-collapse .nav > li > a:focus, .nav-collapse .dropdown-menu a:hover, .nav-collapse .dropdown-menu a:focus {
        background-color: transparent;
    {
}

或者如果您想将它普遍应用于所有分辨率:

.nav-collapse .nav > li > a:hover, .nav-collapse .nav > li > a:focus, .nav-collapse .dropdown-menu a:hover, .nav-collapse .dropdown-menu a:focus {
    background-color: transparent;
{