這篇文章主要講解了“怎么實(shí)現(xiàn)DIV層內(nèi)的文字垂直居中”,文中的講解內(nèi)容簡單清晰,易于學(xué)習(xí)與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學(xué)習(xí)“怎么實(shí)現(xiàn)DIV層內(nèi)的文字垂直居中”吧!
如果是單行文字想垂直居中,只要保證div高和行高保持一致,就可以了。用下面的代碼即可實(shí)現(xiàn):
代碼如下:
#div-a{
height:60px;
line-height:60px;
}
如果是多行文字,上面的垂直居中的方法就不行了,得用變通的方法實(shí)現(xiàn);這里建議使用table方法,在table外面再套上相應(yīng)的div,
代碼如下:
代碼如下:
多行文字居中還有另外一種方法:
多行內(nèi)容居中,且容器高度可變,也很簡單,給出一致的 padding-bottom 和 padding-top 就行:
代碼如下:
.middle-demo-2
{
padding-top: 24px;
padding-bottom: 24px;
}
感謝各位的閱讀,以上就是“怎么實(shí)現(xiàn)DIV層內(nèi)的文字垂直居中”的內(nèi)容了,經(jīng)過本文的學(xué)習(xí)后,相信大家對怎么實(shí)現(xiàn)DIV層內(nèi)的文字垂直居中這一問題有了更深刻的體會,具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司,,小編將為大家推送更多相關(guān)知識點(diǎn)的文章,歡迎關(guān)注!