首页 > 技术文章 > CSS——绝对定位及固定定位

clblogs 2021-09-01 20:53 原文

定位:基于xxx定位,上下左右

1.没有父级元素定位的前提下,相对于浏览器定位
2.假设父级元素存在定位,我们通常会相对于父级元素进行偏移~
3.在父级元素范围内移动

相对于父级或浏览器的位置,进行指定的偏移,相对定位的话,他仍然在标准文档流中,原来的位置会被保留

代码图

效果图

固定定位

代码
body{ height:1000px; } div:nth-of-type(1){ /* 绝对定位:相对于浏览器 */ width:100px; height:100px; background:red; position:absolute; right:0; bottom:0; } div:nth-of-type(2){ /* fixed,固定定位 */ width:50px; height:50px; background:pink; position:fixed; right:0; bottom:0; }

效果图

推荐阅读