很多人在使用z-index属性的时候,都喜欢使用999,9999,99999这样的数字,最早的时候学习老师好像说过最大值是9999,但真的是这样的吗?z-index的最大值、最小值都是多少呢?
无知人生,ivu4e.com,ivu4e.cn
很多人在使用z-index属性的时候,都喜欢使用999,9999,99999这样的数字,最早的时候学习老师好像说过最大值是9999,但真的是这样的吗?z-index的最大值、最小值都是多少呢?
kaR无知
浏览器 | 最大值 | 超过最大值后变成 | 最小值 | 小于最小值后变成 | 备注 |
| | | -2147483648 | -2147483648 |
|
IE7 | | | -2147483648 | -2147483648 |
|
IE8 | | | -2147483648 | -2147483648 |
|
IE9 | | | -2147483648 | -2147483648 |
|
IE10 | | | -2147483648 | -2147483648 |
|
IE11 | | | -2147483648 | -2147483648 |
|
| | 元素消失 | ? | ? |
|
| | | ? | ? |
|
Firefox 29(最新稳定版) | | | -2147483648 | -2147483648 |
|
| | | ? | ? |
|
| | | ? | ? |
|
Safari 5.1.7(最新稳定版) | | | -2147483648 | 数值不变 | 使用的是webkit内核,所以和chrome一致 |
| | | -2147483648 | 数值不变 |
|
Chrome 35(最新稳定版) | | | -2147483648 | 数值不变 | chrome允许设置超过最大值、最小值的z-index,kaR无知 不过超出之后层叠样式会使用最大值和kaR无知 最小值来计算(比如设置为2147483648时,kaR无知 会以2147483647计算层叠关系)kaR无知 |
| | | ? | ? |
|
| | | -2147483648 | 数值不变 | 使用的是webkit内核,所以和chrome一致 |
1 2 3 4 | 测试方法很简单:两个元素都绝对定位,然后分别设置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,这个有时间再做吧。
参考文章:
|
kaR无知
kaR无知
无知人生,ivu4e.com,ivu4e.cn
本文为转载文章,版权归原作者所有,不代表本站立场和观点。
很赞哦! (14)
赏
有话说 (0)