css布局：float,position,flex,transform,grid,::after::before先说说BFC块级格式化上下文BFC是一个独立的布局环境，元素布局是不同的是，它受外界的影响，被看作是一个与世隔绝的独立容器。容器内部的元素在布局时不会影响外部元素，BFC具有一些普通容器不具备的特性。通俗地说，BFC可以理解为一个封闭的大盒子，盒子里面的元素再大也不会影响到外面。BFC可以由某些条件触发，以满足布局要求或解决某些问题；如何创建BFC1.float的值不是none。2.position的值不是静态的，也不是相对的。3.display的值为inline-block,table-cell,flex4.overflowvisible以外的值(hidden,auto,scroll)(1.)同一个BFC中两个容器的外边距会重叠，所以我们可以set，两个不同的BFC(2.)BFC特性规定“BFC的区域不会与浮动容器重叠，相邻元素会在另一个浮动后重叠。为相邻元素设置溢出：hidden生成BFC(3.)当我们不为父节点设置高度而将子节点设置为浮动时，会发生高度塌陷；使用BFC避免marginoverlap/子元素浮动父元素高度塌陷的问题，BFC计算高度时，浮动元素也参与计算，给父元素overflow:hidden；两列布局 leftleftleftleftleftleftleft
