css中如何让table居中

网页设计中常常需要使用表格来展示数据,而表格的样式调整是非常关键的一步。其中,让表格居中是应用最广泛的样式之一。接下来我们就来介绍如何使用CSS让table居中。

table {
    margin:0 auto; /* 设置margin值为0,自动计算左右margin值使其居中 */
    text-align:center; /* 设置文字居中 */
}

css中如何让table居中

以上是最基本的让表格居中设置,但是需要注意的是这段代码只能应用于内联或堆叠块级元素(比如div、p等),而表格的显示方式是表格布局(table layout),是一个表格类的独特元素。因此需要在容器元素中添加一个div元素才能让表格居中。

<div style="text-align:center;">
    <table>
        <!-- table的内容 -->
    </table>
</div>

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效