定义和用法

z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。
注释：元素可拥有负的 z-index 属性值。
注释：Z-index 仅能在定位元素上奏效（例如 position:absolute;）！

说明

该属性设置一个定位元素沿 z 轴的位置，z 轴定义为垂直延伸到显示区的轴。如果为正数，则离用户更近，为负数则表示离用户更远。
Z-index 可用于将在一个元素放置于另一元素之后，只需要设置不同级别的z-index，级别大的块会处于级别低的块的上方。

样例：

  1. <html>
  2. <head>
  3. <style type="text/css">
  5. img.x {
  6. position:absolute;
  7. left:0px;
  8. top:0px;
  9. z-index:-1
  10. }
  11. </style>
  12. </head>
  14. <body>
  15. <h1>这是一个标题</h1>
  16. <img class="x" src="/i/eg_mouse.jpg" /> 
  17. <p>默认的 z-index 是 0。Z-index -1 拥有更低的优先级。</p>
  18. </body>
  20. </html>

结果：
image.png
由于img拥有更低的优先级，所以被文字所遮挡（z-index默认为0）