1、BFC定义、全称、块格式化内容、格式化上下文；是网页盒模型布局中的CSS渲染方式，是一个独立的渲染区域或隔离的独立容器。二、触发条件1、浮动元素，float是none以外的值。2.定位元素，position(absolute,fixed)3.非块级元素定义为块级元素/内联块元素；display为inline-block,table-cell,table-caption（类似表格标题标签caption），flex,inline-flex,grid,inline-grid4,overflowvisible以外的值（scroll,hiddle,auto）。5、正常文档流的父节点和子节点（非浮动）自动组成一个BFC3、特征应用场景1，内部BOX会在垂直方向依次放置。解释：即使不在BFC内部的盒子也是一样的。2、垂直方向的距离由margin值决定。解释：在正常的文档流中，框的垂直距离也是由上下框的最大边距决定的。应用：所以可以通过overflow:hidden来触发BFC机制在父元素上加载这个属性。另外，使用空标签也可以解决合并边距的问题。3.BFC区的元素不会和float元素重叠。说明：不会被浮动元素覆盖应用：两栏布局：左侧固定，右侧自适应布局。向左飘浮;宽度：200px；高度：300px；（左元素）溢出：隐藏；/*创建bfc*/height:300px;(右边的元素)三列布局(圣杯布局)左右两边固定宽度，中间没有宽度，所以中间的宽度是自适应的。向左飘浮;宽度：100px；高度：300px；(左元素)float:right;宽度：100px；高度：300px；（右元素）溢出：隐藏；/*创建bfc*/height:300px;(中间元素)4.计算bfc高度时，浮动元素也参与计算。解释：BFC包含浮动块。应用：使用overflow:hidden清除浮动，因为浮动框在标准文档流中无法支撑父框的高度。5、BFC在页面上是一个独立的容器，容器内的子元素不会影响外部元素。应用：解决margin合并问题。
