垂直+水平居中是一个老生常谈的问题了，现在就固定高度和不固定高度两种情况去讨论
1.父盒子固定高度[定位]
实现1：
father-box: position:relative
child-box：position:absolute+left:50%+top:50%+translate(-50%,-50%)
实现2:
father-box：position:relative
child-box： position:absolute+top:0+right:0+bottom:0+left:0+margin:auto
2.父盒子不固定高度[弹性盒子]
实现1：
father-box:display:table
child-box:display:table-cell+vertical-align:middle+text-align:center
实现2:
father-box:display:flex+align-items:center+justify-content:center
child-box:flex:1