CSS的相对定位和绝对定位

 relative的意思就是相对自己的一开始的位置进行的定位。如图:
但是这个元素的本身边距不变,还在原来位置
 
absolute的意思就是
如果它的父元素设置了除static之外的定位,比如position:relative,或者position:absolute以及position:fixed,那么它就会相对于它的父元素来定位,位置通过left , top ,right ,bottom属性来规定,如果它的父元素没有设置定位,那么就得看它父元素的父元素是否有设置定位 ,如果还是没有就继续向更高层的祖先元素类推,总之它的定位就是相对于设置了除static定位之外的定位(比如position:relative)的第一个祖先元素,如果所有的祖先元素都没有以上三种定位中的其中一种定位,那么它就会相对于文档body来定位(并非窗口,相对于窗口定位的是fixed)
一般z-index和left,top,right,bottom这些元素也是在设置了position的定位之后才会用到
原文地址:https://www.cnblogs.com/llcdbk/p/5581135.html