BFC、IFC、GFC 和 FFC
BFC ：块级格式上下文，指的是一个独立的布局环境，BFC 内部的元素布局与外部互不影响。
IFC ：行内格式化上下文，将一块区域以行内元素的形式来格式化。
GFC ：网格布局格式化上下文，将一块区域以 grid 网格的形式来格式化。
FFC ：弹性格式化上下文，将一块区域以弹性盒的形式来格式化。
BFC创建和作用
它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用。
创建规则
- html标签，根元素
- 浮动元素 (
float不取值为none) - 绝对定位元素 (
position取值为absolute或fixed) display取值为inline-block、table-cell、table-caption、flex、inline-flex之一的元素overflow设置为auto、scroll、hidden，取值不为visible元素
BFC作用
可以包含浮动元素(解决浮动元素令父元素高度坍塌的问题)
不被浮动元素覆盖(解决非浮动元素被浮动元素覆盖问题)
阻止父子元素的 margin 折叠(解决外边距垂直方向重合的问题)
总结
所谓 BFC，块级格式上下文，指的是一个独立的布局环境，BFC 内部的元素布局与外部互不影响。 IFC，行内格式化上下文，将一块区域以行内元素的形式来格式化。 GFC ，网格布局格式化上下文，将一块区域以 grid 网格的形式来格式化。 FFC ，弹性格式化上下文，将一块区域以弹性盒的形式来格式化。
持续学习总结记录中，回顾一下上面的内容： BFC、IFC、GFC 和 FFC，BFC块级格式化上下文(block formatting context),BFC创建和作用？
