CSS层级总结

原创于 2017-06-05 18:15:02 发布 · 1.2k 阅读

CC 4.0 BY-SA版权

文章标签：

19 篇文章

订阅专栏

本文详细介绍了CSS中标准流、浮动及定位元素之间的层级关系。解释了不同定位方式（如relative、absolute、fixed）的特点及其在页面布局中的作用，并强调了层级设置对元素显示的影响。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

标准流盒子，低于浮动的盒子，浮动的盒子又低于定位的盒子。

定位中：absolute是不占位置的，relative是占位置的，fixed是不占位置的。 

而层级的高低，与占不占位置没有关系。

1、必须有定位。（除去static之外）。

2、给定z-index的值为层级的值。（不给默认为0）

1、层级为0的盒子，也比标准流和浮动高。
2、层级为负数的盒子，比标准流和浮动低。
3、层级不取小数
4、层级一样，后面的盒子比前面的层级高。
5、浮动或者标准流的盒子，后面的盒子比前面的层级高。