Open Lawguancong opened 3 years ago
文本流,简单来说就是元素内部的一系列的字符的排列规则。
文档流,英文是normal flow,又翻译为常规流,标准流,正常流,普通流等。
文档流指的是HTML中元素在计算布局排版的过程中,所有处于文档流中的元素会自动的从左到右(非块级元素),从上到下(块级元素)的排列规则。 元素在排版中的定位类型分为三种: (1)文档流:块级格式化的块级盒子,行内格式化的行内盒子以及相对定位的块级盒子和行内盒子（默认static） (2)浮动(float) (3)绝对定位(position:absolute/fixed)
元素脱离文档流之后，将不再在文档流中占据空间，而是处于浮动状态（可以理解为漂浮在文档流的上方）。 脱离文档流的元素的定位基于正常的文档流，当一个元素脱离文档流后，依然在文档流中的其他元素将忽略该元素并填补其原先的空间。
(1)浮动会使元素脱离文档流,但是不会脱离文本流,在于其他盒子的文本内容计算布局的时候,还是占位置的。 (2)绝对定位会使元素脱离文档流,同时也会脱离文本流,在于其他盒子的文本内容计算布局的时候,不占位置。
参考链接 https://blog.csdn.net/shkstart/article/details/107042718 https://www.cnblogs.com/ning123/p/11011845.html https://www.cnblogs.com/ppforever/p/3751509.html https://blog.csdn.net/weixin_43388615/article/details/105080506
文档流和文本流
文本流
文本流,简单来说就是元素内部的一系列的字符的排列规则。
文档流
文档流,英文是normal flow,又翻译为常规流,标准流,正常流,普通流等。
文档流指的是HTML中元素在计算布局排版的过程中,所有处于文档流中的元素会自动的从左到右(非块级元素),从上到下(块级元素)的排列规则。 元素在排版中的定位类型分为三种: (1)文档流:块级格式化的块级盒子,行内格式化的行内盒子以及相对定位的块级盒子和行内盒子（默认static） (2)浮动(float) (3)绝对定位(position:absolute/fixed)
脱离文档流方法
脱离文档流是会呈现什么样的效果呢？
元素脱离文档流之后，将不再在文档流中占据空间，而是处于浮动状态（可以理解为漂浮在文档流的上方）。 脱离文档流的元素的定位基于正常的文档流，当一个元素脱离文档流后，依然在文档流中的其他元素将忽略该元素并填补其原先的空间。
总结
(1)浮动会使元素脱离文档流,但是不会脱离文本流,在于其他盒子的文本内容计算布局的时候,还是占位置的。 (2)绝对定位会使元素脱离文档流,同时也会脱离文本流,在于其他盒子的文本内容计算布局的时候,不占位置。
参考链接 https://blog.csdn.net/shkstart/article/details/107042718 https://www.cnblogs.com/ning123/p/11011845.html https://www.cnblogs.com/ppforever/p/3751509.html https://blog.csdn.net/weixin_43388615/article/details/105080506