使用線高度居中文字
HTML:
<div class="container">
<span>vertically centered</span>
</div>
CSS:
.container{
height: 50px; /* set height */
line-height: 50px; /* set line-height equal to the height */
vertical-align: middle; /* works without this rule, but it is good having it explicitly set */
}
注意: 此方法僅垂直居中單行文字。它不會正確地居中塊元素,如果文字突破到一個新行,你將有兩個非常高的文字行。