盒子居中 BFC

如何让盒子水平垂直居中：

1、设置margin自动auto 上下左右margin都为0
position: absolute;
margin: auto;
top: 0;
left: 0;
right: 0;
bottom: 0;

2、
position: absolute;
top: 50%;
left: 50%;
margin-left: -w/2px;/负数，数值是宽度的一半/
margin-top: -h/2px;/负数，数值是高度的一半/
水平居中：margin 0 auto
垂直居中：vertical-align baseline top middle bottom

简述BFC规则，及解决的问题：

BFC 块级格式化上下文，它是指一个独立的块级渲染区域，该区域拥有一套渲染规则来约束块级盒子的布局，且与区域外部无关。
 内部的标签会在垂直方向上一个接一个的放置;
垂直方向上的距离由margin决定，属于同一个BFC的两个相邻标签的margin值会发生重叠；
每个标签的左外边距与包含块的左边界相接触（从左向右），即使浮动标签也是如此。
BFC的区域不会与float的标签区域重叠。
计算BFC的高度时，浮动子标签也参与计算。
BFC就是页面上的一个隔离的独立容器，容器里面的子标签不会影响到外面标签，反	之亦然。

解决问题：

1、外间距折叠
2、自适应两栏或三栏布局。
3、防止字体环绕
4、清除浮动

来源：https://blog.csdn.net/qq_39454316/article/details/98788133