转换成内联块状了“text-align:center”代码没效果，不能居中

源自：12-4 我还要站个大位置 - 内联块状元素

转换成内联块状了“text-align:center”代码没效果，不能居中

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>内联块状元素</title>

<style type="text/css">

a{

display:inline-block;

width:20px;/*在默认情况下宽度不起作用*/

height:20px;/*在默认情况下高度不起作用*/

background:pink;/*设置背景颜色为粉色*/

text-align:center; /*设置文本居中显示*/

}

</style>

</head>

<body>

<a>1</a>

<a>2</a>

<a>3</a>

<a>4</a>

</body>

</html>

提问者：科里昂 2017-08-01 11:43

个回答

海的那边还是海

2017-08-01 12:27:55

已采纳

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>内联块状元素</title>
<style type="text/css">
div {
text-align:center;
}
a{
display:inline-block;
width:20px;/*在默认情况下宽度不起作用*/
height:20px;/*在默认情况下高度不起作用*/
background:pink;/*设置背景颜色为粉色*/
text-align:center; /*设置文本居中显示*/
}
</style>
</head>
<body>
<div>
<a>1</a>
<a>2</a>
<a>3</a>
<a>4</a>
</div>
</body>
</html>

0
慕仔4164528

2017-08-01 12:26:11

当你加入了display=“block”或者inline-block，或者是给它们加上了whide或者height的样式之后，就应该用盒子模型的部分来使其居中，text-alige只是对文本居中有效，对盒子模型是没有效果的

2