绝对定位、相对定位

position:absolute  绝对定位

是更具最近的定位父级进行定位的,如果没有确定定位父级,就以浏览器窗口进行定位。
比如:position:absolute; left:20px; top:80px; 这个容器始终位于距离浏览器左20px, 距离浏览器上80px的这个位置。
未设置 left top right bottom 的时候,元素还在自己该在的位置,只不过已不再占位。

position:relative  相对定位

是相对于元素本来的位置再进行平移后获得新的位置,也就是说这个新位置是要根据原来的位置来定的
比如 position:relative left:10px; top:-20px; 就是把元素往右移动10像素,往上移动20像素。

谁是定位父级 offsetParent

position:absolute; 元素,从该定位元素往外找,最近一个设置了 position:absolute; 或者 position:relative 的元素,就是改元素的定位父级。如果没有,就以浏览器窗口进行定位

 
 
原文地址:https://www.cnblogs.com/MrZhujl/p/9988266.html