概述
块格式化上下文(block formatting context) 是页面 CSS 视觉渲染(visual CSS rendering)这个过程中的一个概念。它是决定块盒子的布局及浮动元素相互影响的一个因素。
下列情况将创建一个块格式化上下文:
- 根元素或其它包含它的元素
- 浮动 (元素的
float
不为none
) - 绝对定位元素 (元素的
position
为absolute
或fixed
) - 行内块 inline-blocks (元素的
display
: inline-block
) - 表格单元格 (元素的
display
: table-cell,HTML表格单元格默认属性
) - 表格标题 (元素的
display
: table-caption
, HTML表格标题默认属性) -
overflow
的值不为visible
的元素 - 弹性盒子 flex boxes (元素的
display
: flex
或inline-flex
)
块格式化上下文包括了创建该上下文的元素的所有子元素,但不包括创建了新的块格式化上下文的子元素。
块格式化上下文对定位 (参见 float
) 与清除浮动 (参见 clear
) 很重要。定位和清除浮动的样式规则只适用于处于同一块格式化上下文内的元素。浮动不会影响其它块格式化上下文中元素的布局,并且清除浮动只能清除 同一块格式化上下文中 在它前面的元素的浮动。