第一种
display:flex;
justify-content:center;
align-items:center;
第二种
position:absolute;
top:50%;
left:50%;
transform: translate(-50%, -50%);
第三种
position: absolute;
top:50%;
left: 50%;
margin-top: -(盒子自身长度一半)px;
margin-left: -(盒子自身宽度一半)px;
第四种
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
第五种
.father{
display: table-cell;
vertical-align: middle;
}
.son{ margin: 0 auto;
}