前端学习随笔：float布局问题------float元素是否脱离了文档流

时间：2016-03-13 19:45:31 阅读：146 评论：0 收藏：0 [点我收藏+]

标签：

问题：今天学习2016-03-13，我知道float的原始作用为实现文字的环绕效果，但是老师说：对元素设置float属性后，该元素依然处于标准文档流中，同时浮动会

引起父元素的高度塌陷问题（怎么解决，目前不知道）。但是，紧随其后的块元素会无视设置float属性的元素，但是后面元素的文本依然会为float元素让出位置，环绕于周围。既然后元素没有按照标准文档流单独占一行，我是不是可以理解为浮动的元素脱离了文档流？？前后矛盾了。

解答：回答这个问题之前，首先解释一下什么叫脱离文档流！

css中脱离文档流，也就是讲元素从普通的布局排版中拿走，其他盒子在进行定位的时候，会当脱离文档流的元素不存在而进行定位。

目前我所学习的部分，只有绝对定位absolute和浮动float才会脱离文档流。

但是，两者脱离文档流的结果是有区别的。用我的理解，可以说是float是部分脱离文档流，而absolute是完全脱离文档流。也就是说，使用float属性时，其他元素会无视这个float元素，但是其他元素内的文本依然会为这个元素让出文职，环绕在周围（感觉类似于word文字环绕功能），所以称为部分无视。而使用absolute positioning脱离文档流的元素，其他盒子无论是本身还是盒子内的文本都会无视这个元素，也就是我说的完全脱离文档流。

前端学习随笔：float布局问题------float元素是否脱离了文档流

标签：

原文地址：http://www.cnblogs.com/mengzhan/p/5272560.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行