我始终坚信越努力越幸运，加油，未来可期！
垂直居中的布局方式：
方式一：可以利用css3新属性-弹性布局
display:flex;
align-item:center;
水平居中
display:flex;
justify-content:center;
垂直水平居中
display:flex;
justify-content:center;
align-item:center;
注意：这里是给父元素设置这些属性，子元素实现效果
方式二：利用绝对定位+负margin
position:absolute;
top:50%;
margin-top:-height/2;
(前提要知道自身宽高)
当长宽都未知时，可以通过以下方法实现垂直居中：
position: absolute; * /* 相对定位或绝对定位均可 */ *
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
方式三:利用表格
display:table;
子元素
display:table-cell;
vertical-align: middle; 该属性是定义行内元素垂直对齐的，只有行内元素会生效。
text-align:center;
