首先最重要的,困惑最多的relative:
//#demo为父元素
如果你想让这个#demo里的一个div#sub相对于#demo定位在右上角的某个地方,应该给#demo相对定位,#sub绝对定位。
所以:
absolute是相对于自己最近的父元素来定位的,如果你不给#demo相对定位,那么#sub的绝对定位就是相对于body来定位的。
同时,relative的位置定位也与absolute不同:
relative是相对于自己来定位的,例如:#demo{position:relative;top:-50px;},这时#demo会在相对于它原来的位置上移50px。
另:relative 不脱离文档流,absolute 脱离文档流。也就是说:relative 的元素尽管表面上看到它偏离了原来的位置,但它实际上在文档流中还是没变。absolute的元素不仅位置改变了,同时也脱离了文档流。
补充注意:relative和absolute的另外一个很重要的区别就是当被定义成absolute的对象被移出了,那么他原来的位置也就不存在了,
如果被定义成relative的对象被移出了 他原来的位置还在,别的元素就不能替代这个位置.