html - 在 div 元素内居中放置一个 H2

Question

我想将 h2 置于 #top 的中心，但是 vertical-align:middle 不起作用...我不知道该怎么做!

#top {
    display: block;
    position: relative;
    height: 100px;
    background-color: rgba(89,144,222,.6);
}
#top h2{
    text-shadow: 2px 2px black;
    text-align: center;
    color: white;
    font-family:"Impact";
    font-size: 50px;
}

效果是 - http://puu.sh/2mz5M

Answer 1

我明白了，您为 div 定义了高度，这对这种情况非常有用。你可以这样做:

#top h2{
    text-shadow: 2px 2px black;
    text-align: center;
    color: white;
    font-family:"Impact";
    font-size: 50px;
    line-height: 100px;
}