Html 模态显示在固定导航栏后面
所以我有一个基于引导的站点，带有固定的导航栏（在页面顶部跟随你），当我想显示模式弹出窗口时，它会出现在导航栏后面，如何修复 我用 它也会出现在summernote模式中用于上传图片，所以看起来所有模式都会出现在这些导航栏后面Html 模态显示在固定导航栏后面,html,css,twitter-bootstrap,Html,Css,Twitter Bootstrap,所以我有一个基于引导的站点，带有固定的导航栏（在页面顶部跟随你），当我想显示模式弹出窗口时，它会出现在导航栏后面，如何修复 我用 它也会出现在summernote模式中用于上传图片，所以看起来所有模式都会出现在这些导航栏后面 导航栏是固定的，这意味着z索引只与它的子项相关。简单的修复方法是简单地增加外部模态容器的顶部边距，将其从导航栏后面轻轻地向下推到页面上 否则，您的模式标记必须位于标题中，并且您需要为其指定比父导航栏的z索引更高的z索引。您需要调整CSS中的z索引。导航的z索引比其他任何东西
导航栏是固定的，这意味着z索引只与它的子项相关。简单的修复方法是简单地增加外部模态容器的顶部边距，将其从导航栏后面轻轻地向下推到页面上
否则，您的模式标记必须位于标题中，并且您需要为其指定比父导航栏的z索引更高的z索引。您需要调整CSS中的z索引。导航的z索引比其他任何东西都高。因此，要调整它，您需要为您的模式弹出窗口添加更高的z索引。代码看起来像 例如z指数：3 要做到这一点，您必须为弹出窗口设置一个位置 例如位置：绝对位置 在设置位置后，您还可以通过将此代码放入CSS来进一步调整位置 顶部：500px；左：500px 这意味着放置绝对位置的容器从顶部移动500像素，从左侧移动500像素 如果你不能理解z指数是什么。我会给你提供一张照片
为了解决这个问题，我在CSS中为模态背景（模态后面的阴影）添加了一个超高的
z索引值（1000000），为模态添加了一个稍高的值（1000001）：
.modal-backdrop {
z-index: 100000 !important;
}
.modal {
z-index: 100001 !important;
}
希望有帮助 现在发布答案已经太晚了，但是我今天在模态弹出窗口和导航栏上遇到了类似的问题
当弹出窗口显示时，使用javascript将导航栏的z索引设置为零，反之亦然
注意：使用whateverElement.style.zIndex=0
而不是whateverElement.style.z-index=0
作为javascript处理-
作为减法运算符。我今天遇到了这个问题，并提出了一个不涉及修改CSS的替代解决方案。如果您使用的是MVC，则可以使用截面标记并在布局中（主体中的任何位置）渲染模态。这将导致默认模态行为起作用，并且不再将其隐藏在导航栏后面
在_layout.cshtml（body标记内）上：
类似的东西在其他语言中也可以使用，最重要的是不需要修改CSS。哇，谢谢你，我从来没有想过，只需按下这些堆叠元素就可以了……嗯，谢谢你，我会尝试理解它的……啊哈哈哈哈，所以z-index有点像photoshop中的图层位置等等。。。hahahaz索引是html格式的。在这里，我会给你一个非常好的资源。该链接解释了z索引，并给出了很好的示例。我认为.modal background{z-index:1；}
就足够了。
<body>
<!--... OTHER Layout/header code...-->
@RenderSection("modals", required: false)
</body>
@section modals{
@Html.Partial("_MyModal")
}