什么是BFC和他的用途

BFC  Block formatting context全称 块级 格式化 上下文

形成BFC 分为以下几种

1.html元素也就是根元素

2.overflow 不能为visible，  overflow：visible的意思就是当发生裁剪时，内容显示在外面

3.position 为absolute,或者fixed

4.float不能none

5.display：inline-block, table-cell, table-caption, flex, inline-flex  （inline-block其实是 inline 和 block的结合，既不换行也可以改变宽度和高度）

 

BFC会出现以下情况：

1. 在同一BFC下的2个box会出现margin重叠的情况 ，通过把其中一个box外面设置成BFC可以解决

2. 计算BFC高度的时候，浮动元素也会被添加