JS 系列之 BFC

大家好，我是戴锐宁，第一次编写前端相关的技术文章，写的不好大佬们可以给点建议，BFC 算是在面试中比较常见的话题了，但很多人还是没有搞清楚 BFC 是什么？以及如何创建 BFC？等系列问题，接下来我们一起来探讨一下 BFC ???

BFC 概念

首先，我们先给出 FBC 的定义。

BFC（Block Formatting Contexts）是块格式化上下文，是 CSS 在渲染过程中生成块级盒子的一个区域，你可以理解为，具有 FBC 特性的元素，块级盒子里面的元素不会影响外面的元素，

因此，我们必须先掌握盒子模型。

盒子模型

什么是盒子模型？

在 CSS 中，任何一个元素都可以看作是一个盒子，而一个盒子通常由四部分组成（由内到外）：内容（content）、内边距（padding）、边框（border）和外边距（margin）。