块级框：显示属性为block、list-item、table的元素会生成块级框。并参与块格式化上下文。inline-levelbox：display属性为inline、inline-block、inline-table的元素会生成一个inline-levelbox。并参与内联格式化上下文。磨合框：仅在css3中可用。BFC（BlockFormattingContexts）块级格式化上下文块格式化上下文（blockformattingcontext）是一个独立的渲染区域，容器内部的子元素不会影响布局中的外部元素。只有Block-levelbox参与，它规定了内部Block-levelBox如何布局。块格式化上下文包括创建它的元素的所有子元素，但不包括创建新块格式化上下文的元素的子元素。如何生成根元素float属性不是noneposition是absolute还是fixeddisplay是inline-block,table-cell,table-caption,flex,inline-flexoverflow是不可见布局规则里面的boxes会在垂直方向依次放置方向。Box的垂直距离由margin决定。属于同一BFC的两个相邻框的边距将重叠。每个元素的边距框的左侧接触包含块的边框框的左侧（对于从左到右的格式，否则）。即使存在浮动也是如此。BFC的区域不会和浮动框重叠。BFC是页面上一个隔离的独立容器，容器内部的子元素不会影响外部的元素。反之亦然。BFC计算高度时，浮动元素也参与计算。解决边距重叠问题解决float引起的高度塌陷问题解决文字换行问题（此方法可用于自适应布局）例如：.containbox{border:1pxsolidblack;宽度：300px；高度：300px；}.leftbox{浮动：左；宽度：100px；高度：100px；背景色：红色；}.rightbox{高度：250px；背景色：#fff500；}
