[转]relative、absolute和float

position:relative和position:absolute均可以改变元素在文档中的位置，都能激活元素的left、top、right、bottom和z-index属性。（默认这些属性未激活，设置了也无效）

　　设置position:relative和position:absolute都会让元素浮起来，会改变正常状况下的文档流。

　　不一样：

　　position:relative会保留本身在z-index:0层的占位，left、top、right、bottom值是相对于本身在z-index层的位置。

　　position:absolute会彻底脱离文档流，再也不z-index:0层保留占位符，其left、top、right、bottom值是相对于本身最近的一个设置了position:relative或position:absolute的祖先元素的，若是祖先元素全都没有设置，那么就相对于body元素。

 

　　float也能改变文档流，不一样的是，float不会让元素浮到另外一个元素上面，它仍然让元素在z-index:0层排列，只能经过float:left和float:right来控制元素在同一层里"左浮"和"右浮"。float会改变正常的文档流排列，影响周围元素。

 

　　position:absolute和float会隐式的改变display类型，不论以前什么类型的元素（display:none除外）,只要设置了position:absolute和float中任何一个，都会让元素以display:inline-block的方式显示：能够设置长宽，默认宽度并不占满父元素。就算显示的设置display:inline或者display:block，也仍然无效（IE6双倍边距BUG利用display:inline解决）。

　　position:relative却不会隐式改变display类型。