前端开发之文档流和文本流

1.文档流与文本流

文本流

文本流,简单来说就是元素内部的一系列的字符的排列规则。

文档流

文档流,英文是normal flow,又翻译为常规流,标准流,正常流,普通流等。

文档流指的是HTML中元素在计算布局排版的过程中,所有处于文档流中的元素会自动的从左到右(非块级元素),从上到下块级块元素)的排列规则。

元素在排版中的定位类型分为三种:

(1)文档流:块级格式化的块级盒子, 行内格式化的行内盒子以及相对定位的块级盒子和行内盒子

(2)浮动(float)

(3)绝对定位(position:absolute/fixed)

---

2.脱离文档流和文本流

脱离文档流,指的是元素脱离正常元素的布局排版规则,其他处于文档流中的盒子在计算布局排版时,会自动无视已脱离文档流的元素来进行定位。

浮动(float)与绝对定位(position:absolute/fixed)之间的区别就是

(1)浮动会使元素脱离文档流,但是不会脱离文本流,在于其他盒子的文本内容计算布局的时候,还是占位置的。

(2)绝对定位会使元素脱离文档流,同时也会脱离文本流, 在于其他盒子的文本内容计算布局的时候,不占位置。