什么是BFC？ BFC是指“块级格式化上下文”，是网页中box模型布局的CSS渲染模式。 创建的BFC元素是独立的框，但只有框模型才能参与BFC的创建。 BFC规定了内部框的布局，此独立框中的布局不受外部影响，当然也不影响外部元素。
BFC特性内部的box在垂直方向上从上部开始各配置一个。 盒的垂直距离由margin决定。 属于同一BFC的两个相邻box的margin从左侧重叠发生，每个元素的margin box左侧与包含块boder box的左侧接触。 对于从左到右的格式，否则相反。 BFC在页面上是隔离的独立容器，即使存在浮动也不与float box重叠，容器中的子元件不影响外部元件，反之亦然。 计算BFC的高度时，浮动元素也参与计算。 如果BFC内部有浮动，BFC将计算高度，包括浮动元素的高度，以避免影响外部元素的布局。 如何触发BFC？ 1 .除浮点无外的值2 .除溢出可见外的值(隐藏、自动、滚动)3.display ) table-cell、table-caption、inline-cacable