我创建了一个带有前置伪元素的“标题”元素。伪元素必须在父元素之后。在我给我的“标题”一个 z-index 之前,一切都很好。
我想要的是:前景中的黄色“标题”,背景中的红色伪元素和黄色“标题”元素上的简单 z-index 30。
header {
background: yellow;
position:relative;
height: 100px;
width: 100px;
z-index:30; /*This is the problem*/
}
header::before {
content:"Hide you behind!";
background: red;
position:absolute;
height: 100px;
width: 100px;
top:25px;
left:25px;
z-index:-1;
}
您可以在此链接 ( http://jsfiddle.net/tZKDy/ ) 上测试我的问题,并且在设置/删除 de 'header' 元素上的 z-index 时会看到问题。