css垂直居中如何实现

利用CSS3的transform:translate

.center{
    width:%;
    position: absolute;
    top: %;
    left: %;
    -moz-transform: translate(-%, -%);
    -ms-transform: translate(-%, -%);
    -webkit-transform: translate(-%, -%);
    transform: translate(-%, -%);
}

利用Flexbox

.center {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-moz-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-moz-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}