1. 程式人生 > >vertical-align垂直居中

vertical-align垂直居中

效果圖


程式碼

<div class="mui-content">

<div class="ab">垂直居中</div>
<div class="b"></div>
</div>
<style type="text/css">
.mui-content{
background-color: white;
height: 400px;
}
.b {
display: inline-block;
vertical-align: middle;
height: 100%;
}

.ab {
font-size: 15px;
display: inline-block;
vertical-align: middle;
width: 98%;
}

</style>

我做這個的時候想了很久,後來參考了一些程式碼,覺得這樣做相對來說是最方便了。

一個容器裡面有2個塊,一個內容為空垂直居中,另外一個相對居中