使用Z-Index定位

Question

我们可以使用z-Index将一个HTML元素放在另一个元素上吗？ 例如：

<div>One</div>
<div>Five</div>

现在一个人应该超过五个......

我的问题可能很基本，但.........

Answer 1

将您需要在顶部显示的元素赋予更高的z索引值。

<div style='z-index: 2'>first</div>
<div style='z-index: 1'>second</div>

读

Specifying the stack level: the 'z-index' property

Answer 2

要使z-index工作，您需要将position设置为您想要分层的每个div的绝对，相对或固定，然后您可以使用left和{将两个元素放在彼此之上{1}}属性。

z指数越高，div越“高”。即，top高于z-index:1，将其视为从您的屏幕出来的一叠透明纸张。

更多信息：

http://www.w3schools.com/Css/pr_pos_z-index.asp

Answer 3

我不是你问的问题，但使用z-index的重点是将一个HTML元素放在另一个上面。

您可以获得更多信息here。

Answer 4

给三个不同的div一个唯一的ID，如：

<div id="divOne">One</div>
<div id="divTwo">Two</div>
<divid="divThree">Three</div>

在你的css样式表中：

#divOne {position:absolute;z-index:1;}
#divTwo {position:absolute;z-index:2;}
#divThree {position:absolute;z-index:3;}

Answer 5

与其他层相比，z-index的偏好越小。也就是说，z-index = 2的图层将在z-index = 1的图层上方呈现。

<div style='position:absolute;z-index:2'>first</div>
<div style='position:absolute;z-index:1'>second</div>