BFC的理解

bfc是

从是什么和形成情况以及bfc的应用场景的三个点来说吧

BFC是块级格式上下文，浏览器的一种渲染模式。

每一个BFC区域只包括其子元素，不包括其子元素的子元素。 每一个BFC区域都是独立隔绝的,互不影响。

形成bfc的几种情况

1.根元素

2.display设置浮动元素

3.overflow不为visible

4.position为fixed和absolute

5.非块级盒子的块级容器（ inline-block,inline-flex， table-cell, 和 table-caption）

应用场景

1.解决塌陷，当两个盒子的外边距产生塌陷，可以给盒子外面套个父盒子，给父盒子设置overflow：hidden

2.清除浮动

当父元素高度自适应，子元素浮动，父盒子的高度会坍塌，解决方案给父盒子设置overflow:hidden

3.多列布局

给父盒子设置display：flex，子盒子之间设置margin

前端知识网络错综复杂，如有疏漏，欢迎交流。