html的相对定位和绝对定位是什么意思

position：absolute这个是绝对定位；是相对于浏览器的定位。比如：position：absolute；left:20pxtop:80px

这个容器始终位于距离浏览器左20px,距离浏览器上80px的这个位置。position：relative是相对定位，是相对于前面的容器定位的。这个时候不能用top

left在定位。应该用margin。比如：<div

class="1"></div><div

class="2"></div>当1固定了位置。1的样式float:leftwidth:100px

height:800px2的样式为float:left

position：relative；margin-left:20pxwidth:50px2的位置在1的右边，距离120px

一、相对定位 relative

1.参照物为自身；

2.相对定位只改变显示的位置，而不会改变占用的空间位置；

3.关于距离的正负值

二、绝对定位 absolute

1.参照物为具有定位属性的父元素。

PS:如果距离当前最近的父元素不具有定位属性，则会一层一层向外找，直到找到具有定位属性（这里仅要求三种定位属性任一都可）的父元素而进行定位，如果找到最后未能找到具有定位属性的父元素，de则最终会依照body进行定位。

2.绝对定位不仅会改变显示的位置，而且会改变占用的空间位置。就好比是元素处于一种悬空漂浮的状态，没有“肉体”！

3.关于距离的正负值，和上面的相对定位的性质一样。

三、固定定位 fixed

固定定位是将某个元素固定在浏览器的某个确定的位置，不随滚动条的移动而变化；   

固定定位的位置是  相对当前浏览器窗口  的；

如图，position:relative 是在3个DIV原来各自位置的基础上进行移动的，也就是说和父元素没有直接的关系，仅仅相对于他们自身在文档中本该出现的位置进行移动。比如，设置了right：10px，就表示在原位置的基础上，向左移动10px，这时将超出父元素的外框。需要注意的是，relative是相对于自身，而不是相对于父元素。

另外，相对于父元素进行定位，是指在父元素设置为 relative ，子元素设置为 absolute 的情况下。如果父元素没设置为relative，而是默认的static，那么子元素的absolute就是相对于body进行定位，而不是父元素。

---