如何使 HTML 表格的内容居中？

Question

我正在使用 HTML <table> 并且我想将 <td> 的文本对齐到每个单元格的中心。

如何水平和垂直居中对齐文本？

原文由 Rajagopal 웃 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

这是一个带有 CSS 和内联 style 属性的示例：

 td
{
    height: 50px;
    width: 50px;
}

#cssTable td
{
    text-align: center;
    vertical-align: middle;
}

 <table border="1">
    <tr>
        <td style="text-align: center; vertical-align: middle;">Text</td>
        <td style="text-align: center; vertical-align: middle;">Text</td>
    </tr>
</table>

<table border="1" id="cssTable">
    <tr>
        <td>Text</td>
        <td>Text</td>
    </tr>
</table>

http://jsfiddle.net/j2h3xo9k/

编辑： valign 属性在 HTML5 中已弃用，不应使用。

原文由 David Laberge 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

在你的 td 元素中居中文本的CSS是

td {
  text-align: center;
  vertical-align: middle;
}

原文由 Carsten 发布，翻译遵循 CC BY-SA 4.0 许可协议