BFCBFCBFCBFChttp://www.itcast.cn/news/20201016/16152387135.shtmlBFC - Block Formatting Context 块级格式化上下文触发BFC的条件：·body根元素本身就是·设置浮动，不包括none·设置定位，absoulte或者fixed·行内块显示模式，inline-block·设置overflow，即hidden，auto，scroll·表格单元格，table-cell·弹性布局，flex成为BFC区域的特性：每一个BFC区域只包括其子元素，不包括其子元素的子元素，也就是没有孙子。每一个BFC区域都是独立隔绝的,互不影响!并不是所有的元素都能成为一块BFC区域，只有当这个元素满足以上任意条件的时候才会成为一块BFC区域。BFC能够解决的问题：（具体演示可看上面的链接里的案例）--解决外边框的塌陷问题（垂直塌陷）就是两个块级元素都有margin:100px。但实际上margin会重合。两个块级元素垂直之间的距离还是100px一般使用 overflow:hidden这个属性，将两个元素设为BFC区域，他们就会相互独立。会有各自的margin了。--解决给子元素设置margin-top，会带着父元素一起跑的问题 （包含塌陷）一般给父盒子设置 overflow:hidden 使其为BFC区域，让父盒子变为一个独立的区域，这样在BFC区域内部的任何操作，都不会影响到外部。--所有子元素都浮动了，且父元素没有设置高度，就会造成浮动塌陷，父元素会失去原有的高度。一样使用 overflow:hidden 设置父元素为BFC区域，可解决浮动塌陷，并且BFC可以将所有浮动的元素包裹起来。--BFC还可以阻止标准元素被浮动元素覆盖。
