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

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

科里昂

2017-08-01 11:43

<!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>


写回答 关注

2回答

  • 海的那边还是海
    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>


    科里昂 回复海的那边还是...

    好的谢谢啦

    2017-08-01 15:50:05

    共 3 条回复 >

  • 慕仔4164528
    2017-08-01 12:26:11

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

    科里昂

    谢谢啦

    2017-08-01 13:10:06

    共 1 条回复 >

初识HTML(5)+CSS(3)-升级版

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

1225807 学习 · 18234 问题

查看课程

相似问题