1. 盒子垂直居中的方式

（1） 定位+margin :auto

position:absolute;//相对定位

　　width:80px;

　　height:50px;

　　top:0;

　　left:0;

　　right:0;

　　bottom:0;

　　margin:auto;//使其垂直居中

（2）

position: absolute;

top: 50%;

left: 50%;

transform: translate(-50%,-50%);

（3）已知宽高 100px margin top left 宽高的一半

position: absolute;

top: 50%;

left: 50%;

margin: -50px 0 0 -50px;

（4）

display: flex;

align-items: center; /*定义body的元素垂直居中*/

justify-content: center; /*定义body的里的元素水平居中*/

......只是小总结待更新相关例子