Question

<div> <span>水平居中</span> </div>

<div>
<span>水平居中</span>
</div>急求如何将该span中的字水平居中！！！！！！！！！！！

Answer 1

方法1: span{ width:100px; height:20px; line-height:20px; text-align:center; float:left;}
方法2: span{ width:100px; height:20px; line-height:20px; text-align:center; display:block;}
方法3: span{ float:left; padding:5px 20px;}

说明:
方法1和方法2都在处理span标签显示方式,span标签默认是行内元素,如果给它设置了float或dispaly:block属性就能让它转为块级元素,line-height设置行高,设置它后文字会垂直居中,text-align:center设置文字水平居中,这样达到自己的需求
方法3利用内边距进行设置,padding:5px 20px(完整写法:padding:5px 20px 5px 20px;) 设置了上右下左各个参数,如果上下,左右参数相同就可以简写,例如:你的div宽高分别为:100px 20px; 你设置span最大不能超过父级div,其中span的宽为:字体长度加上左右padding值,高同理

如有疑问可以追问

Answer 2

可以这样：
span{display:inline-block;width:100px;text-align:center;}

span必须先给inline-block，不然width不起作用，接着再给text-align