有如下结论:
默认(z-index: auto;)情况下,所有绝对定位的元素根据其在文档中出现的顺序显示。
为z-index赋值之后,绝对定位的叠加依赖于父元素的z-index值,值越大越显示在上层。
隶属于同一父元素的同级兄弟元素,根据其z-index值确定其在z轴上的顺序,值越大越显示在上层。
隶属不同父元素的同级元素,其在z轴上的顺序将由它们的父元素的z-index值确定,而与它们本身的z-index值无关。
z-index: auto;等价于z-index: 0;
可以这么说:对于绝对定位的元素,父元素在z轴上的顺序将决定他所有后代元素在z轴上的顺序,z-index值大的父(祖先)元素将使得它的子孙元素优先显示。
或者您这么理解:确定绝对定位元素叠加顺序时,纵向比较父元素的z-index值大小,横向比较兄弟元素z-index大小,值越大越显示在上层。
说明:以上所有截图均来自FF 3.6,无特别说明的地方,均已兼容其他(主流)浏览器。笔者水平有限,有错误的地方请指正!
注:内容参考《CSS权威指南》(第三版)










