text-align:center写在span内为什么不能让居中
原因
是内联元素，当它在
里面的时候，它的属性是内联元素的属性。宽度是根据内容定的，不可改变，所以给它设置文字居中不会有什么改变（或者可以理解为它仅有内容，没有填充）；在
外面的
中设置text-align:center让文字居中可以，因为
是一个块元素，霸占了浏览器的这一整行，有宽度，可以让文字水平居中。例以下代码：
<style>
.box{
height: 200px;
width: 200px;
background-color: chartreuse;
text-align: center;
}
.box span {
/* margin-left: 100px; */
/* text-align: center; */
color: coral;
}
</style>
</head>
<body>
<div class="box">
<span>123</span>
</div>
</body>
margin:o auto 也不能在内联元素中使用，因为内联元素宽度是由内容多少决定的，auto不能设置水平居中。但margin设置左右可以使用，要想上下也有反映的话，可将内联转化为块状元素。
padding对于内联元素左右也有效果。
扫一扫
1216
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
