html - 将元素置于 Bootstrap 背景之外

Question

<div id='header'>
    <button style="z-index:9999"></button>
    <div class="modal-backdrop am-fade"></div>
</div>

我有一个 html 看起来像这样，模态背景覆盖了整个页面。但我想显示这个特定的按钮，我添加了 z-index按钮到 9999 ，但它没有用。背景的z-index是1040 ，有什么我需要做的吗？我正在用 angular js 编写一个指令，我在指令中附加了背景，所以 <div>模态背景应位于标题内，并与 <button> 处于同一级别.谢谢

Answer 1

为了使 z-index 起作用，您需要用它定义适当的 position 规则。一个例子可能包括...

button {
    position: relative;
    z-index: 9999;
}

参见 CSS z-index Property了解更多信息

z-index only works on positioned elements (position:absolute, position:relative, or position:fixed).