1.BFC是什么?
Block Formatting Context,块级格式化上下文;
它是一个独立的渲染区域，只有Block-level box 参与，规定了如何布局，并且与外部不相关。
2.如何触发BFC?
(1)浮动元素:float除了none以外的属性值;
(2)定位:position的absolute,fixed;
(3)display为inline-block,table-cells,flex,table(可以生成table-cells;
(4)overflow除了visible属性值都可以
3.BFC的布局规则有什么?
(1)在BFC中，盒子从顶端开始垂直地一个接一个地排列.;
(2)盒子垂直方向的距离由margin决定。属于同一个BFC的两个相邻盒子的margin会发生重叠;
(3)在BFC中，每一个盒子的左外边缘（margin-left）会触碰到容器的左边缘(border-left)（对于从右到左的格式来说，则触碰到右边缘）;
(4)BFC的区域不会与有float的元素的区域重叠 ;
(5)计算BFC的高度时，浮动子元素也参与计算;
(6)BFC就是页面上的一个隔离的独立容器，容器的里面的元素不会影响到外面的元素，也不会被外面的元素影响。
4.应用场景
(1)外边距重叠;
(2)高度塌陷;
(3)清除内部浮动;
(4)自适应两栏及两栏以上布局;
(5)嵌套元素的margin重叠。
日常小更新~~~~
