水平居中 4种写法
行内元素: text-align: center;
块级元素: margin: 0 auto;
使用定位+transform设置
position:absolute +left:50%+ transform:translateX(-50%);
使用flex设置居中
display:flex + justify-content: center;
垂直居中 4种写法
1.行内或者行内块元素
设置line-height 等于height ;
2.使用定位+transform
position：absolute +top:50%+ transform:translateY(-50%);
3.父元素设置flex布局,使用align-items来设置纵轴对齐
display:flex + align-items: center;
4.父盒子设置为一个表格单元格,使用vertical-align设置居中
display:table-cell + vertical-align: middle;
