为什么在打开模式时导航栏中的元素不会像页面的其余部分一样变暗？（引导）答案

【问题标题】：Why don't the elements in the navbar darken like the rest of the page when opening modal? (bootstrap)为什么在打开模式时导航栏中的元素不会像页面的其余部分一样变暗？（引导）
【发布时间】：2020-05-06 05:49:24
【问题描述】：

示例：[已编辑] - 单击获取报价按钮。导航栏元素不会变暗。

此外，调整屏幕大小以模拟手机屏幕，您会看到导航栏元素与所有其他元素重叠。我该如何解决这个问题？

提前感谢所有帮助。

【问题讨论】：

请向我们展示您的代码，而不仅仅是指向您网站的链接。但我的猜测是导航栏上的 z-index 高于 modal

标签： css twitter-bootstrap bootstrap-modal

【解决方案1】：

首先，您必须从 .header 类中删除 z-index 规则。它的位置是相对的，它有 1000+ 索引。第二个“nav navbar-nav navbar-right bgblue”要么在单击时从 ul 中删除类，要么 .nav.navbar-nav.navbar-right.bgblue{ background: transparent }

【讨论】：

【解决方案2】：

.header {
    background: transparent;
    color: #fff;
    z-index: 1030;
    border: 0px solid #ddd;
    height: 75px;
    position: relative;
}

将 z-index 更改为小于 1040

【讨论】：

【解决方案3】：

这是 z-index 的问题。您的类 .header 的 z-index 超过 .modal。尝试给予

.header{z-index:1035;}.

对于响应式视图或移动视图，您可以提供.toggled{display:inline-block; width:100%;} 或从.header 和.navbar 中删除高度。

希望这会有所帮助。如有疑问请告诉我。

【讨论】：