折叠的导航栏背景颜色更改

Question

上有一个折叠的导航栏

标签的背景颜色是white，我想改变一下。我在 CSS:

中尝试了这段代码

@media (max-width: 767px) {
  .nav-collapse
    {
        background-color: red;
    }
}

有点效果，它在每个选项卡下添加了红线，但不会更改背景颜色。
如果您在移动设备上访问该站点并单击导航栏将其折叠，您可以看到它的作用。

我正在尝试仅针对移动设备更改此设置。

我确定有一个简单的解决方案，但我想不出来。
有人可以帮忙吗？

Answer 1

这是因为你的灰色背景设置在锚点上，而不是 NAV 本身

如果你这样做：

.header ul.nav li a { 
  background: red;
}

它会起作用..

我刚刚再次检查，你有 3 个元素添加了背景，你的外包装上有红色，你有白色添加到列表元素，你的锚上有灰色

Answer 2

基本上在您的 html 中有内联样式，可以删除它或更改颜色，或者如果您希望通过 css 更改它，请使用以下代码：

.nav-collapse ul li { backgroud-color: red !important; }

Inline style Refrence Image

Collapsed navbar background color change