BFC 是什么？如何生成 BFC？BFC 有什么作用？举例说明
BFC直译为"块级格式化上下文"。它是一块独立的区域，容器里面的子元素不会影响到外面的元素。要促发BFC的生成，则满足以下其中一个条件：
- 1.float属性不为none；
- 2.position为absolute或fixed；
- 3.display为inline-block, table-cell, table-caption, flex, inline-flex；
- 4.overflow不为visible；
BFC可以清除内部浮动；BFC可以包含浮动，让父容器生成新的BFC可以使父容器在视觉上包围了浮动的子元素，因而清除了浮动。比如例子：例子说明11
防止margin重叠，属于同一个BFC的两个相邻Box的margin会发生重叠，我们可以把其中一个元素生成新的BFC，这样它们的边距就不会合并。
在什么场景下会出现外边距合并？如何合并？如何不让相邻元素外边距合并？给个父子外边距合并的范例
- 外边距合并指当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。当两个外边距都为负数时，取其绝对值的较大者，当两个外边距为一正一负时，取两者的和。
-
父子外边距合并的需要满足父元素没有border和paddinng隔开。
形成BFC 可以阻止外边柜合并，对于垂直相邻的元素可以设置浮动或设置其中一个元素为display:inline-block;对于父子元素外边距，可为父元素设置padding或border。
父子外边距合并：
-
给父元素添加border
-
添加padding
