html - 在父元素中间居中文本

Question

<div id="wrapper" style="height:400px;width:400px;">
 <div id="example">
  Text
 </div>
</div>

我正在寻找一种方法让 #example 进入 #wrapper 的中心(左、右、上和下)。

Answer 1

我认为有多种方法可以实现您想要的。一个是:

#wrapper{
    display:table-cell;
    width:400px;
    height:400px;
    vertical-align:middle;
    border:1px solid red;
}
#example{
    width:200px;
    margin:auto;
    text-align:center;
    background:blue;
}

演示:http://jsfiddle.net/SsD4Q/3/

希望对您有所帮助!