1.flex布局：
.parent{
justify-content:center; // 子元素水平居中
align-items:center; //子元素垂直居中
display:flex;
display:-webkit-flex;
}2.使用 -webkit-box（
目前所有主流浏览器都不支持 box-align 属性。
Internet Explorer 10 通过私有属性 -ms-flex-align 支持.
Firefox通过私有属性- MOZ-box-align支持。
Safari和Chrome通过私有属性-WebKit-box-align支持。
注意：Internet Explorer 9及更早IE版本不支持弹性盒子。
）
.innerDisplay{
display:-webkit-box;
display:-webkit-flex;
display:flex;
-webkit-box-align:center;
-webkit-align-items:center;
}3.使用绝对定位：
.div{
position:absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}