css垂直居中的方法很多讨永，其中有些方法是依賴固定寬高實現(xiàn)，這些寫法非常不友好夜郁，我自己項目中很少使用什燕。
我習慣使用以下兩種方法
1、CSS3的transform來實現(xiàn)
<div id="wrapper">
<div class="middle-contents">
</div>
</div>
#wrapper {
position: relative;
}
.middle-contents {
position: absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
}
2竞端、flex布局
<div id="wrapper"></div>
#wrapper {
/*flex 布局*/
display: flex;
/*實現(xiàn)垂直居中*/
align-items: center;
/*實現(xiàn)水平居中*/
justify-content: center;
}
