css图层z-index元素叠加 – CSS高级教程

上一章CSS高级教程请查看:css position定位属性
CSS z-index属性可以与position属性结合使用,创建像Photoshop这样的图层效果。
使用z-index属性在层中叠加元素通常HTML页面被认为是二维的,因为文本、图像和其他元素被安排在页面上而没有重叠。然而,除了它们的水平和垂直位置,盒子也可以沿着z轴堆叠,即使用CSS   z-index属性将一个盒子叠在另一个上面。此属性指定position值为absolute, fixed或relative方框的堆栈级别。
每层的z轴位置用整数表示,表示渲染的堆叠顺序。具有较大z-index的元素与具有较小z-index的元素重叠。
【css图层z-index元素叠加 – CSS高级教程】z-index属性可以帮助你创建更复杂的网页布局。下面的示例演示了如何在CSS中创建层。

.box { position: absolute; left: 10px; top: 20px; z-index: 2; }

    推荐阅读