如何以CSS垂直居中文本
这个问题在这里已经有了答案：
你可以设置你的容器来display:table-cell并添加vertical-align:middle ：
http://jsfiddle.net/ptriek/h5j7B/1
（但IE7和以下将不会这样...）
那么，有几个解决方案。
最简单的是
#centerme
{
// will center the text vertically, but looks bad with multiliners
line-height:20em;
}
对于多轮车，你需要定位一个箱子
#parentbox
{
// we need the "parent" to have some kind of height
height:20em;
// the most important... position children "relative" to the parent
position:relative;
}
.childbox
{
position:absolute;
left:0;
top:50%;
margin-top:-5em; // this pulls the child back "up" to the vertical center
}
这里的问题是你的多线程的“高度”必须是已知的（或者至少是猜测的），所以它实际上是垂直的。
你需要知道的
没有纯粹的CSS方法可以知道元素的高度，这样就可以让我们以“自适应”的方式垂直居中它！
这意味着，当您更改文本时，您必须更改CSS以确保它们仍然适合。
这可能很烦人，而这正是大多数人使用javascript来解决这种CSS“烦恼功能”烦恼的原因。 最后，JavaScript让我们更容易（至少在这种情况下）。
更多
关于这个问题，围绕网络和本网站进行了很多问答。 如果你错过了它们，这里有一些：
还有更多; 所有提供个别解决方案的个案。 这些可以帮助你更有信心（正如你最初所说的那样，你是这种CSS的新手）。
<div style="height:50px;line-height:50px;">
Text
</div>