css样式z-index最大值和z-index最小值

最新推荐文章于 2022-11-11 03:08:11 发布

一月清辉

最新推荐文章于 2022-11-11 03:08:11 发布

阅读量5.5k

点赞数

分类专栏： css布局文章标签： z-index最大和最小值 z-index的那些事

原文链接：https://www.uphong.com/article_read_8712.html

版权

css布局专栏收录该内容

42 篇文章 5 订阅

订阅专栏

z-index最大值:
IE FireFox Safari的z-index最大值是2147483647 。
Opera的最大值是2147483584.。
IE Safari Opera在超过其最大值时按最大值处理。
FireFox 在超过最大值时会数据溢出正负不定,但有一点可以肯定绝对不会高于2147483647层
最小值
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相同时,按网页中相应代码出现的前后顺序定位层级的高低,后出现的层高于先出现的层。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<style>
		#one,#two{
			width:200px;
			height:200px;
			position:absolute;
		}
		#one{
			left:0;
			top:0;
			background:red;
			z-index: 100;
		}
		#two{
			left:100px;
			top:100px;
			background:yellow;
			z-index: 100;
		}
	</style>
	<body>
		<div id="one"></div>
        <div id="two"></div>
	</body>
</html>
// 虽然z-index相等，但是由于two在one后面，故two在one上边

效果如下：
在这里插入图片描述

跨浏览器永远最大：2147483647
跨浏览器永远最小：Hack(”IE,Safari,Opera”:-2147483648,”FireFox”:0)

参考链接 https://www.uphong.com/article_read_8712.html

一月清辉

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
css样式z-index最大值和z-index最小值

z-index最大值:IE FireFox Safari的z-index最大值是2147483647 。Opera的最大值是2147483584.。IE Safari Opera在超过其最大值时按最大值处理。FireFox 在超过最大值时会数据溢出正负不定,但有一点可以肯定绝对不会高于2147483647层最小值IE FireFox Safari的z-index最小值是-214...
复制链接

扫一扫