Question

CSS中，浮动元素添加了定位（relative或absolute）之后，它与文档流之间的关系是什么？

有三个块div1、div2、div3，三者皆浮动时是这样：
1.平面图

1.立体图

后来我给div1添加了属性position：relative；left：200px;就变成了下面这样
2.平面图

2.立体图

想要请教的是，浮动元素不占任何正常文档流空间，但是它的定位是基于正常文档流，所以意思是说加了定位的浮动元素仍旧脱离了文档流吗？还有，为什么div1会和div2、div3重叠在一起，手册里不是有“浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止”吗？怎么解释？谢谢。





Answer 1

我的理解是，加了浮动以后，元素占有的实际高度变成0，所以才能并排显示。定位的话个人觉得想对定位是基于正常文档流的，绝对的话就脱离。。。