使用线高度居中文本

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 */ 
}

注意： 此方法仅垂直居中单行文本。它不会正确地居中块元素，如果文本突破到一个新行，你将有两个非常高的文本行。