本文基于 CSS 2.2 标准文档中视觉格式化模型 Normal Flow 小结进行整理。
标准中这一部分主要描述用户代理 ( User Agent ) 如何为可视媒介 (Visual Media) 处理文档树。在视觉格式化模型中，文档中的每个节点都会根据盒子模型 ( Box Model ) 生成零个或多个盒子。这些盒子根据下面条件进行布局：
- 盒子的尺寸和类型。
- 定位方式 ( 常规流、浮动或绝对定位 )
- 文档树中元素之间的关系。
- 其他信息 ( Viewport 的尺寸、图片的固有尺寸等 )
下面介绍一些重要的概念。
重要概念
- 包含块 ( Containing blocks ): 包含块是一个盒子，其包含的后代盒子根据它计算位置和尺寸。
- 块级元素 ( Block-level elements): 格式化为块的的元素，块级元素生成 块级主盒 ( Block-level Principal Box )，块级盒子 ( Block-Level Box ) 参与 块格式化上下文 ( BFC, Block Formatting Context )
- 块容器盒 ( Block Container Box ): 块容器盒是只包含 块级盒子 ( Block-Level Boxes ) 或 行内盒子 ( Inline-Level Boxes ) 的盒子。
- 块盒 ( Block Boxes): 块级盒子同时是块容器的称为块盒。
[TODO]
