CSS三大定位
三大定位
position:fixed 固定定位position:relative 相对定位position:absolute 绝对定位
⚠️：使用定位时，一定要配合定位的坐标来使用，left、right、bottom、top表示固定元素距离某边多远
固定定位
position：fixed ：固定定位，是相对于浏览器窗口来进行定位的，不论页面是否滚动，如何滚动，固定定位元素实现的位置不会发生改变。- 特点：
- 它脱离了标准文档流
- 它的层级比标准文档流里面的元素，所以固定定位元素他会压盖住标准文档流里面的元素
- 它不会再占用空间
- 它实现的位置不会随着浏览器的滚动而改变
相对定位
position-relative：相对定位，是相对于自身的位置进行定位的，不论是否进行位置移动，实际上都占用着原来的位置。- 特点：
- 它没有脱离标准文档流
- 它如果没有设置定位的坐标，那么它会在老家留下一个坑
- 它设置了定位的坐标以后，那么它会将标准文档流中的元素压盖住
- 它的定位坐标值可以是负数
- ⚠️：相对定位元素会在老家留下一个坑，一般情况很少单独使用，相对定位元素主要是配合“绝对定位”一开始用的
绝对定位
position-absolute：绝对定位，在没有规定left和top的位置时，是相对于其父元素的左上角定位的(不包含padding的区域)- 特点：
- 它脱离了标准文档流
- 它不再占用空间
- 定位元素会压盖住标准文档流中的元素，所以会覆盖上一个元素
- 当前上一级（
父级）设置了定位，则绝对定位会以当前定位为参照物，若当前上一级未设置定位，则以当前的祖先级为参照物，若祖先级及祖先级的上一级都未设置，则以 浏览器 作为参照物进行绝对定位。
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！
