HTML表格内容居中怎么设置？

水平居中（最常用）

<style>
  td, th {
    text-align: center; /* 文字水平居中 */
  }
</style>
<table border="1">
  <tr>
    <th>姓名</th>
    <th>年龄</th>
  </tr>
  <tr>
    <td>张三</td> <!-- 内容将居中显示 -->
    <td>25</td>
  </tr>
</table>

垂直居中

<style>
  td, th {
    height: 60px;     /* 设置行高 */
    vertical-align: middle; /* 文字垂直居中 */
  }
</style>

水平+垂直双居中

<style>
  td, th {
    text-align: center;
    vertical-align: middle;
    height: 60px;
  }
</style>

整表在页面居中

<style>
  table {
    margin: 0 auto; /* 表格整体水平居中 */
    width: 80%;     /* 需设置宽度 */
  }
</style>

Flexbox实现完美居中（推荐响应式布局）

<div style="display: flex; justify-content: center; align-items: center; height: 200px;">
  <table>
    <tr><td>用Flex容器实现表格内容完全居中</td></tr>
  </table>
</div>

注意事项：

1. 避免过时属性：
   不要使用已废弃的HTML属性（如<td align="center">）,不符合现代网页标准。
2. 优先使用CSS：
   样式与结构分离便于维护，推荐使用外部样式表：

   <link rel="stylesheet" href="styles.css">

3. 响应式适配：
   移动端建议添加媒体查询：

   @media (max-width: 600px) {
     table { width: 100%; }
   }

参考来源：MDN Web文档 – CSS表格样式、W3C CSS规范、Google Web开发最佳实践。
专业提示：始终通过W3C验证工具（validator.w3.org）检查代码合规性。