如何在 html 视图中创建图层（或增加图层的 z 索引）？答案

【问题标题】：how to create layer in html view (or increase z index of layer )?如何在 html 视图中创建图层（或增加图层的 z 索引）？
【发布时间】：2015-10-08 11:34:30
【问题描述】：

您能告诉我为什么我的菜单选项出现在滚动视图下方吗？

实际上，当我单击菜单按钮打开菜单选项时，我的屏幕上有一个菜单按钮。它显示菜单选项并滚动我的滚动显示在菜单选项上方

http://plnkr.co/edit/G8mp53rQlF562hEkgmgT?p=preview

菜单选项应该在滚动竞争之上？我已经增加了 z 指数..但不起作用？

    .nav_bar {
    background: #597A4D!important;
    border-style: none;
    height: 44px;
    border: 0px!important;
    border-radius: 0px!important;
    z-index:99999;

}

我自己找到了解决方案

Anwser plunker

.nav_bar {
    background: #597A4D!important;
    border-style: none;
    height: 44px;
    border: 0px!important;
    border-radius: 0px!important;
    z-index:99999;

}

【问题讨论】：

您在哪里/如何增加了 z-index？
我使用了 Z-index:99999;在菜单选项中，但它不起作用。我尝试在此类中添加导航栏折叠折叠
首先，Z-index != z-index，并且“在菜单选项中”没有任何意义。显示 CSS
我没听懂你想说什么？你能用 plunker 吗
@Shruti 你的固定代码和非工作代码不一样吗？

标签： javascript jquery twitter-bootstrap css ionic-framework

【解决方案1】：

菜单栏出现在滚动容器的后面，因为两个容器的堆栈顺序相同。指定 z-index 将使菜单元素具有更大的堆栈顺序。

将 z-index 添加到列表项。

.nav>li
{
    z-index: 1;
}

【讨论】：

请考虑添加至少一些文字向 OP 解释，并让更多读者回答为什么以及如何回答原始问题。

【解决方案2】：

Samir 想说的很简单，z-index 意味着元素在浏览器中显示的优先级。这意味着，如果你申请

.nav->li
{
   z-index: 1;
}

该元素的优先级高于其他元素。通过定义 z-index，您可以定义元素显示的优先级，这样可以避免上述问题中描述的情况。

我知道定义 z-index 没有限制。

【讨论】：