先上图
CSS z-index 属性
z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。
注释:元素可拥有负的 z-index 属性值。
注释:Z-index 仅能在定位元素上奏效(例如 position:absolute;)!
说明该属性设置一个定位元素沿 z 轴的位置,z 轴定义为垂直延伸到显示区的轴。如果为正数,则离用户更近,为负数则表示离用户更远。
我们知道z-index值较大的元素将叠加在z-index值较小的元素之上。对于未指定此属性的定位对象,z-index 值为正数的对象会在其之上,而 z-index 值为负数的对象在其之下。
z-index最大值:
IE FireFox Safari的z-index最大值是2147483647 。
Opera的最大值是2147483584.。
IE Safari Opera在超过其最大值时按最大值处理。
FireFox 在超过最大值时会数据溢出正负不定,但有一点可以肯定绝对不会高于2147483647层
z-index最小值:
IE FireFox Safari的z-index最小值是-2147483648
Opera的z-index最小值-2147483584
FireFox在-2147483648<=z-index<0时层不显示 在z-index<-2147483648时溢出实际数字正负不定
IE Safari Opera在z-index<0时显示,在小于其最小值时都按其最小值处理
z-index等值时
各个浏览器当两个层z-index相同时,按网页代码中层出现的顺序,后出现的层高于先出现的层。
跨浏览器永远最大:2147483647
跨浏览器永远最小:Hack(”IE,Safari,Opera”:-2147483648,”FireFox”:0)
最大数值和使用的字符有关。以前一直以为超过999就不成了呢。现在晓得差得远呢。纵然浏览器的取值不大一样。
参考资料:
http://joeist.com/2012/06/what-is-the-highest-possible-z-index-value/
http://hi.baidu.com/runner/item/a10faee0511d39266cabb8ea
http://blog.sina.com.cn/s/blog_53d3c24a0100mpny.html