本文主要是介绍块级上下文格式（Block Formatting Context，BFC），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
概念
块级上下文格式（BFC）是 CSS 中的一个概念，用来描述块级盒子在页面布局中的行为。一个块级上下文格式（BFC）是一个独立的渲染区域，其中的元素布局受到这个上下文中的其他元素的影响，而不受外部元素的影响。
创建 BFC 的情况
- 根元素或包含根元素的元素（例如：
<html>）。 - 浮动元素（元素的
float不是none）。 - 绝对定位元素（元素的
position是absolute或fixed）。 - 行内块元素（元素的
display是inline-block）。 -
表格单元格（元素的
display是table-cell）。 - 表格标题（元素的
display是table-caption）。 - 包含浮动元素的元素（元素的
overflow不是visible）。
BFC 的作用
- 清除浮动：当父元素包含浮动元素时，可以通过创建 BFC 来清除浮动，避免父元素塌陷，常用的方法是给父元素设置overflow:hidden。
- 防止外边距合并：当相邻块级元素的外边距发生合并时，可以将其中一个元素放入 BFC 中，从而避免外边距合并。
- 创建自适应的两栏布局：通过创建 BFC 可以实现两栏布局中一个固定宽度，一个自适应宽度的效果。
- 避免元素被浮动元素覆盖：当一个元素被浮动元素覆盖时，可以将该元素放入 BFC 中，使其避免被浮动元素覆盖。
这篇关于块级上下文格式（Block Formatting Context，BFC）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
