表格居中问题

来源:3-4 编程练习

樱桃小团子

2020-08-07 13:46:12

<html>

<head>

    <title></title>

<meta charset="utf-8">

</head>

    <body>

    <!-- 在此编写代码 -->

    <table  width="100%"  height="180px" align="center">


        <tr bgcolor="pink">

            <td>1111111111</td>

        </tr>

    </table>

    </body>

</html>

【老师,这段代码为什么我中间的内容111显示的不是居中的啊,然后我在这段里面嵌入一个表格时,也是在table后面写的center,那个就是居中的了】

写回答

1回答

好帮手慕星星

2020-08-07

同学你好,因为td单元格铺平了整个视口,所以没有居中效果

http://img.mukewang.com/climg/5f2cfd5509c9ed1319120270.jpg

如果想要文本居中,可以在tr或者td中添加align属性

http://img.mukewang.com/climg/5f2cfd7e0956ecff04500165.jpg

效果

http://img.mukewang.com/climg/5f2cfd8709ae0c3619170192.jpg

另外同学说的嵌套是这样吗?

http://img.mukewang.com/climg/5f2cfdc0093f656405920308.jpg

这是因为嵌套的表格没有宽度,由内容撑起来的,所以能看到居中效果

http://img.mukewang.com/climg/5f2cfdde091b790b19120200.jpg

如果嵌套的table也设置宽度为100%,同样是没有居中效果的,自己可以测试下。

祝学习愉快!

0

0 学习 · 40143 问题

查看课程