如果是單行文字想垂直居中,只要保證div高和行高保持一致,就可以了。用下面的代碼即可實現(xiàn):
#div-a{
height:60px;
line-height:60px;
}
如果是多行文字,上面的垂直居中的方法就不行了,得用變通的方法實現(xiàn);這里建議使用table方法,在table外面再套上相應的div,
代碼如下:
<table>
<tr>
<td style=”vertical-align:middle;height:300px;background-color:red”></td>
</tr>
</table>
多行文字居中還有另外一種方法:
多行內(nèi)容居中,且容器高度可變,也很簡單,給出一致的 padding-bottom 和 padding-top 就行:
.middle-demo-2
{
padding-top: 24px;
padding-bottom: 24px;
}
新聞熱點
疑難解答