在构建bootstrap 4导航栏菜单时，我试图在单击切换按钮后仅设置响应式菜单的样式;但是，我注意到没有崩溃和崩溃的UL只有1个css选择器 .
我正在使用wordpress，所以我的案例中的UL是boostrap walker nav但我创建了一个Codepen来演示我遇到的静态html问题 .
我需要一个单独的UL或UL作为容器外部，当点击切换按钮时，我可以相应地设置它（在我的情况下是黄色bg）并且我能够接近的唯一方法是创建另一个一个在容器div之外 .
当切换菜单处于活动状态但仅在<700px左右时，此方法有效 . 当它没有坍塌的粗糙时，还有另一个导航 .
我可以隐藏容器外的菜单，直到用js激活切换菜单或者有更好的方法吗？
在研究解决方案时，我遇到了类似的问题Bootstrap 4 collapsed navbar background color但它没有用
/* change navbar background on collapse */
@media (max-width: 768px) {
nav.navbar {
background: lightgray;
}
}
我觉得这应该是以前出现的东西，但我无法在任何地方找到解决方案 . 我希望我的问题足够简明扼要 .
1 回答
似乎找到了我的问题的答案 . 我使用媒体查询只针对导航栏，当它在我需要的宽度时添加样式 . 我找到了一个非常酷的解决方案，可以完美地获得我需要的全宽bg颜色，而不是分开div . https://css-tricks.com/full-width-containers-limited-width-parents/