文档流、常规流、普通流、正常布局流都是指 Normal Flow，它定义了两种盒子：Block Box、Inline Box

    • 页面上从左往右，从上往下排列的元素流，就是 Normal Flow

    块级元素、块级盒子都是指 Block Box 内联元素、行内元素、内联盒子都是指 Inline Box

    文本流：文档的读取和输出顺序，也就是我们通常看到的由左到右、由上而下的读取和输出形式。 可以通过 CSS 属性进行设置：direction: ltr|rtl

    当说块级元素时，其实是说 html 有些标签，在浏览器中，默认的 CSS 属性为display: block
    当说行内元素时，其实是说 html 有些标签，在浏览器中，默认的 CSS 属性为display: inline

    当我们没有使用 CSS 控制 HTML 样式时，浏览器按照默认 CSS 布局方式是：Normal Flow。
    在 Normal Flow 中，Block Box 和 Inline Box 都有各自特定的行为表现。

    在下面，我们叫做块级盒子和内联盒子，这可以比较好的和 CSS 盒子模型相对应，方便理解。

    内联盒子（Inline Box）的行为

    1. 盒子不会产生换行
    2. width、height 属性不起作用
    3. 垂直方向的 padding、margin、border 会被应用，但不会把其他 Inline Box 推开
    4. 水平方向的 padding、margin、border 会被应用，但会把其他的 Inline Box 推开

    块级盒子（Block Box）的行为

    1. 每个盒子都会换行
    2. width、height 属性可以发挥作用
    3. padding、margin、border 会将其他元素从当前盒子周围推开
    4. 盒子会在内联的方向上扩展并占据父容器在该方向上的所有可用空间，在绝大数情况下，意味着盒子会和父容器一样宽

      个人理解的内联方向是上下左右，这也就是为什么块级盒子在垂直方向上，会和父容器 margin 合并。