本文探讨了CSS定位中的元素层级顺序，重点介绍了z-index属性的作用和使用规则，包括auto和数值的含义。此外，还总结了普通层、浮动层和定位层的覆盖关系，并分享了两种实现盒子居中的方法。同时，文章讨论了相对定位、绝对定位和固定定位的特点，以及它们对元素的影响，如脱离文档流和提升层级。最后，比较了定位与浮动的区别，指出两者在脱离文档流和文本流上的不同表现。
定位元素的层级顺序
元素的定位与文档流无关，所以它们可以覆盖页面上的其它元素。
z-index属性指定了一个元素的堆叠顺序（哪个元素应该放在前面或后面）。
<img src="D:/web/2021/2021一阶段资料/day07/笔记/media/day07_01.jpg" style="zoom:50%;" />
- 取值
- auto(默认值) 堆叠顺序与父元素相等
- 数值：拥有更高堆叠顺序（数值越大）的元素总是会处于堆叠顺序较低的元素的前面
- 总结
- 普通层，浮动层，定位层覆盖关系总结
- 提示：从父原则
实现盒子居中的方法
**方法一：**
实现思路：margin负值配合百分比。
**方法二：**
实现思路：left，right，top，bottom并用，配合margin：auto。
>如果元素的四个边的位置是使用“top”、“right”、“bottom”和“left”来描述的，那么元素的“height”和“width”将隐式地由偏移量决定。
>如果包含块是块级，则相对于包含块的边界即（包括padding），如果包含块是行级，则相对于包含块的内容区域。
**注意**&#
最低0.47元/天 解锁文章
398
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
