BFC是一套渲染机制,是指内容会显示到容器里面,而不是到容器外面。相当于在元素外面创建一堵墙,让元素内外的的内容不会互相影响。
官方的解释是块级格式化的上下文,主要是指在渲染的过程中形成块级的盒子状的渲染区域,包括本身以及间距等。在整个的渲染过程中,不会互相影响的原则。
以下列举的为常规的BFC的创建方式: – overflow:hidden,不为visible即可 – position值不为static,relative – float值不为none – display: table-cell table-caption inline-block,flex