关于BFC（前端常见面试题）

1、什么是BFC？

BFC是一块独立的布局环境，保护其中内部元素不收外部影响，也不影响外部。本身BFC是一种css的布局方式，只是我们可以利用它来解决外边距折叠的问题，BFC并不是专门用来解决这个问题而创的；

2、如何触发BFC？

float的值不是none、position的值不是static或relative 、display的值是inline-block 或 table-cell 或 flex 或 table-caption 或 inline-flex、overflow的值不是visible；

3、BFC的用途？

a.解决父子的外边距折叠问题（因为BFC模型只作用于本身的内部元素，就是父子关系），给父元素加入上述的css属性即可，（注意：无法解决父元素兄弟之间的外边距折叠问题）、
b.实现了块级元素独占一行的特性，并且规定了浮动元素不被静态文档流元素影响。（这是为什么块级元素独占一行的原因）、
c.清除浮动影响，BFC在计算高度时，会一同计算浮动元素的高度，所以也可以清除浮动带来的影响。