BFC-块级格式化上下文

1、什么是BFC?
BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素。反之也如此。

2、BFC的特点？

• margin 不会与外部元素发生重叠
• 不会与float元素发生重叠
• 计算高度时，浮动元素也计算在内

3、哪些属性会触发BFC?

• overflow: 不为visible
• position: absolute/fixed
• display: flex/inline-flex/inline-block/table-cell
• float 不为none