CSS DIV span 垂直居中

寫一個頁面，用到了垂直居中，但是頁面是自適應的，所以div的高度也是不固定的 只能使用百分比來指定高度，然后測試了好長時間  就是文字弄不了垂直居中。

於是 自己整理了一個親測可行的方案。

具體代碼如下：

<div style="height:100%;display:table;width:100%">
<span style="display:table-cell;text-align:center;vertical-align:middle">52</span>
</div>

效果如下：

 

將div display:table;

span display: table-cell

將div 樣式設置為表格，height:100%;width:100%   

然后 將span文字設置為text-allign:center ; vertical-align:center  

 注意：高度與寬度一定要設置，固定值 或者100%值都可以，如果不設置高度與寬度，則沒有效果。