浮动图片后,为什么文字会环绕图片

来源:2-7 使用浮动后产生的问题

z慌慌

2020-04-22 21:32:00

请问:当一个img图片浮动时,会产生文字环绕,而不是遮挡住部分文字呢?不是浮动后脱离文档流流吗?为什么三个div盒子不会像文字环绕那种效果,接着排列呢?

写回答

1回答

好帮手慕粉

2020-04-23

同学你好,关于同学的问题回答如下:

1、 文档流是指html文档加载解析时从上到下,从左向右,但相对于盒子模型来说,float浮动后脱离文档流,但是没有脱离文本流。文本流是指html文本的显示,是相对于文字段落来说的。所以浮动后的元素并不会影响文字内容的展示,文字会根据加载顺序,依次开始继续加载。

2、同第一个问题,因为当div浮动之后,脱离文档流,就不会占据文档的位置,所以下面的div会往上移动。文档流才是元素在页面中所占据的位置,元素脱离文档流就不会占据位置了。

3、图片和文字这两个解析是比较特殊的。假如一个元素浮动会影响到它们的时候,它们会找到一个不被挡住的地方显示,所以会产生一个环绕效果,这个与文本流无关。

祝学习愉快~

1

0 学习 · 40143 问题

查看课程