Question

div中span 的居中问题

如下，要使span中的文字在div下靠底水平居中，应该怎么做呢？？

<div >
<dl>
<dd>1</dd>
<dt>1111</dt>
<dd>2</dd>
<dt>2222</dt>
</dl>
<span><a href="#">水平居中</a></span>
</div>

Answer 1

把span 升级为块级元素，宽度定义为div 的宽度。然后使用定位，再给span添加 text-align:center;

Answer 2

<style>
div {text-align:center;}
div dd,div dt {text-align:left;}
</style>
<div>
<dl>
<dd>1</dd>
<dt>1111</dt>
<dd>2</dd>
<dt>2222</dt>
</dl>
<span><a href="#">水平居中</a></span>
</div>

Answer 3

<div style="position:relative; padding-bottom:20px;">
<dl>
<dd>1</dd>
<dt>1111</dt>
<dd>2</dd>
<dt>2222</dt>
</dl>
<span style="width:100%; position:absolute; bottom:0; text-align:center;"><a href="#">水平居中</a></span>
</div>

Answer 4

div{position:relative;}
span{display:block;position:absolute;bottom:0px;text-align:center;}

Answer 5

给span加样式 <span style="display:inline-block;margin:0 auto;">