z-index的最大值、最小值

王朝学院·作者佚名 2016-05-24

宽屏版字体: 小 | 中 | 大 | 超大

z-index的最大值、最小值浏览器

最大值

超过最大值后变成

最小值

小于最小值后变成

备注

IE6

2147483647

-2147483648

IE7

2147483647

-2147483648

IE8

2147483647

-2147483648

IE9

2147483647

-2147483648

IE10

2147483647

-2147483648

IE11

2147483647

-2147483648

Firefox 2

2147483647

元素消失

Firefox 3

2147483647

Firefox29(最新稳定版)

2147483647

-2147483648

Safari 3

16777271

Safari 4

2147483647

Safari 5.1.7(最新稳定版)

2147483647

数值不变

-2147483648

数值不变

使用的是webkit内核，所以和Chrome一致

Chrome 29

2147483647

-2147483648

数值不变

Chrome35(最新稳定版)

2147483647

数值不变

-2147483648

数值不变

chrome允许设置超过最大值、最小值的z-index，

不过超出之后层叠样式会使用最大值和

最小值来计算（比如设置为2147483648时，

会以2147483647计算层叠关系）

Opera 9

2147483647

？

Opera 21(最新稳定版)

2147483647

数值不变

-2147483648

数值不变

使用的是webkit内核，所以和chrome一致

测试方法很简单：两个元素都绝对定位，然后分别设置z-index值（通过浏览器自带开发工具修改CSS；js操作）。结论：z-index的取值范围为-2147483648 ~~ 2147483647。而C的Int型数据类型的大小也为-2147483648 ~~ 2147483647。说明CSS的z-index在C中是作为INT型计算的。一般z-index都不超过100000，所以基本上不用考虑大小问题。PS:chrome中对于width和height的最大限制为33554428，这个有时间再做吧。参考文章：http://stackoverflow.com/questions/8565821/css-max-z-index-valuehttp://www.puidokas.com/max-z-index/http://stackoverflow.com/questions/491052/mininum-and-maximum-value-of-z-index#answer-491105http://www.quora.com/Cascading-Style-Sheets/Is-there-a-maximum-value-for-z-index