我如何将元素分层到另一个元素下面？

Question

http://jsfiddle.net/pzRV8/

在该代码段的底部，有一个名为container的部分。现在，我试图将阴影覆盖在它上面，而不是在它下面。感谢。

Answer 1

基于定位和z-index的DOM元素层。 z指数越高，元素越高（图片显示一组牌，其中0是底牌，51是顶牌 - 数字也可以是负值）。要使z-index正常工作，元素必须具有绝对位置。

绝对位置

position: absolute;

Z-索引

z-index: 0;

要进行更改（尽管它们是静态的，我不是静态内容的粉丝），请尝试：

将此添加到容器定义中：

position: absolute;
z-index: -1;

将header definition的保证金底部更改为：

margin-bottom: 352px;

示例：http://jsfiddle.net/wh8tX/

Answer 2

您可以通过z-index属性获得所需的结果，但请记住z-index仅适用于定位，因此我已在.spotlight＆amp;中定义了定位。 .container上课。

检查演示

我希望你看起来像这样： - http://jsfiddle.net/pzRV8/6/

Answer 3

您需要zindex。请记住zindex仅适用于position。位置可以是相对的，固定的，绝对的

<div style="zindex:1; position:relative">first</div>
<div style="zindex:2; position:relative">second</div>

Answer 4

因为堆叠是由html文档标记排序的（除非更改） 然后header自动获得z-index:1 .container将获得z-index:2

您需要按如下方式覆盖它：

提供header position:relative和z-index:1

给.container z-index:-1

参见工作示例： http://jsfiddle.net/pzRV8/9/