Z索引不适用于绝对位置

问题描述

第二个div是position: static（默认值），因此z-index不适用于它。

您需要定位（将位置属性设置为，而不是在这种情况下static可能需要的其他位置relative）要分配给的任何内容z-index。

解决方法

我打开控制台（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>");

popupContent应该高于一切，但受#popupFrame不透明度的影响。

内容未包含在#popupFrame中，这使它变得很奇怪。

目标是创建像firefox这样的警告框