float 究竟有没有脱离文档流，为什么文字会围绕在float元素周围，而块状元素依然会忽略float元素？

Question

float 究竟有没有脱离文档流，为什么文字会围绕在float元素周围，而块状元素依然会忽略float元素？

Answer 1

关于float，题主可以看看我之前总结的这篇文章~
深入解析float

Answer 2

float并没有完全脱离文档流，完全脱离文档流的是position，关于float的讲解，推荐你看看张鑫旭的CSS float浮动的深入研究、详解及拓展。

Answer 3

刚学习到这一部分，本来是来搜答案的，结果发现这个问题我应该尝试答一发。

题主这里是不能用两个不完全一样的文档来验证问题的。第一个案例有文字，第二个没有，所以你是看不到有没有环绕的。

这个问题的第一个案例中，你用DIV包裹了行内元素，不管是块元素还是行内元素，都是会跟随环绕前面的元素（float会占用标准文档流的空间）。

第二个案例中，你把文字去掉的，所以你看不到文字环绕，它其实也是环绕的。你把文字注释了，所以这个DIV是没有内容的，只显示了底层的背景颜色。

刚学到这里，我自己也是有很多问题，然后逐个验证了。

块级元素和行内元素：会跟随环绕，把标准文档流的空间填充满。

行内块元素：不会环绕。如果标准文档流的空间足够的话，行内块元素就能跟随前面的元素。如果空间不够，会另起新行。比如文档宽度是800px，里面有个左浮动的div是400px，此时如果行内块元素是400px的话就可以填充，如果是401px或以上宽度就就另起一行。

有什么不对的地方请大家指正。