Z索引不适用于绝对位置
我打开控制台（chrome \ firefox）并运行以下行：
$("body").append("<div id=\"popupFrame\" style=\"width:100%;height:100%;background-color:black;opacity:0.5;position:absolute;top:0;left:0;z-index:1;\" />");
$("body").append("<div id=\"popupContent\" style=\"width:200px;height:200px;z-index:1000;background-color:white;\" >dasdasdsadasdasdasdasdasd</div>");
内容未包含在#popupFrame中，这使它变得很奇怪。
目标是创建像firefox这样的警告框
问题答案：
第二个div是position: static（默认值），因此z-index不适用于它。
您需要定位（将位置属性设置为，而不是在这种情况下static可能需要的其他位置relative）要分配给的任何内容z-index。
-
问题内容： 我有一个默认位置（即）和一个位置。 如果设置元素的z索引，似乎不可能使固定元素位于静态元素之后。 我可以通过 在static元素上使用来解决此问题 ，但是有人可以告诉我 为什么会 这样吗？ （似乎有一个与此问题类似的问题，固定位置破坏了z-index，但是它没有令人满意的答案，因此我在这里用示例代码来询问） 问题答案： 这个问题可以通过多种方式解决，但实际上，了解堆叠规则可以使您找到最
-
问题内容： 假设您将以下CSS应用于div标签 左边距和右边距无效 但是，如果您有亲戚，它可以正常工作，即 这是为什么？我只想将元素居中 有人可以解释为什么将页边距设置为绝对位置无效吗？ 问题答案： 编辑：这个答案曾经声称不可能用来使绝对定位的元素居中，但这根本不是事实。因为这是最受好评和接受的答案，所以我想我只是将其更改为正确。 当您将以下CSS应用于元素时 然后为元素提供固定的宽度和高度，例如
-
问题内容： 我希望外圈在圆圈后面，但是当我尝试使用它时，它不起作用。什么也没做 我做了2个环，一个环在圆圈的顶部，没有顶部，另一个环在圆圈的后面，我只是无法移动，我不知道为什么。 问题答案： 您需要删除转换并将其替换为其他内容，然后才能将伪元素移到后面： 正如我们在规范中所读到的： 以树顺序的所有 position ，opacity或 transform子代 ，分为以下类别： 所有以“ z-ind
-
我有一个动画的SafeArea视图，里面有两个按钮，视图有位置：绝对。当我点击按钮时，它会穿过它，并点击de按钮后面的元素。我目前正在使用zIndex和elevation，并尝试了许多解决堆栈溢出的方法，例如： 使用TouchableHighlight 使用onPressIn而不是onPress 将TouchableOpity从report-nate-手势处理程序中导入，而不是从report-na
-
问题内容： HTML CSS 问题 文本应放在我的“表格单元”的中间。一切正常，直到我添加“ position：absolute”。现在它不能再将我的内容放在中间了吗？为什么不？它仍然知道我的身高和宽度，因为我在CSS中进行了设置。 有什么聪明的解决方法吗？ 问题答案： 一切正常，直到我添加“ position：absolute”。现在它不能再将我的内容放在中间了吗？为什么不？ 部队，在这里阅读第
-
创建由4个相等部分组成的着陆页（Divs）。当你悬停在一个部分上时，它的大小应该会增加，而其他部分的大小会减少（高度或宽度取决于它在悬停div中的位置。 两个问题......1.高度的减少不起作用（宽度的减少起作用）2.悬停时，顶部两个部分在底部两个部分后面展开。底部的两个部分在顶部的两个部分展开，这是我想要的