float 浮动 文档流和文字流区别

关于float属性的脱离文档流的问题

使用float浮动后,元素虽然会脱离文档流,但还处在文本流的位置当中,所以就不会出现重叠的效果吗?

下面我自己试了一下,给两个DIV分别设置了样式,而只给第一个DIV设置了float浮动属性,然而效果显示,第一个DIV覆盖了第二个DIV,出现了重叠效果

float 浮动  文档流和文字流区别

float 浮动  文档流和文字流区别

 

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

float只是脱离了文档流的dom空间但是还占据着文字空间.使用float脱离文档流时,其他盒子会无视这个元素,但其他盒子内的文本依然会为这个元素让出位置

 
上一篇:2018.10.25 bzo1227: [SDOI2009]虔诚的墓主人(组合数学+扫描线+bit)


下一篇:前端(八)—— 高级布局:文档流、浮动布局、流式布局、定位布局、flex布局、响应布局