BFC（Block Formatting Context）是块级格式化上下文的缩写，它是 CSS 中一个重要的概念，用于规定块级盒子如何布局和相互作用。BFC 的主要作用是解决盒子的浮动、清除浮动、外边距折叠等问题。
BFC 具有以下特点：
- BFC 内部的元素在垂直方向上一个接一个地放置，从包含块的顶部开始。
- BFC 内部的元素不会与浮动元素重叠，而是会根据规则将自身调整到浮动元素的下方。
- BFC 内部的元素会发生外边距折叠，即相邻的两个元素的外边距会合并为一个外边距。
- BFC 可以包含浮动的元素，从而避免浮动元素对其他元素的影响。
- BFC 的大小由包含块和内部元素的大小决定，可以通过设置 overflow 属性来改变 BFC 的大小。
BFC 的创建方式有以下几种：
- 根元素（html）和 body 元素都是 BFC。
- 设置元素的 display 属性为 inline-block、table-cell、table-caption、flex、inline-flex 等值。
- 设置元素的 position 属性为 absolute 或 fixed。
- 设置元素的 float 属性为 left 或 right。
BFC 可以解决盒子的浮动、外边距折叠等常见问题，是 CSS 布局中非常重要的概念。在实际开发中，可以通过合理地使用 BFC，来实现更加高效和稳定的布局效果。
