结论：文本对齐必须作用于td/th元素，text-align控制左右、vertical-align控制上下，整表居中需用margin:auto或flex布局；HTML align属性已废弃，须用CSS替代。
直接说结论：调整表格中文本位置，不是“调表格”，而是“调单元格里的内容”；text-align 和 vertical-align 必须作用在 td 或 th 上才真正生效，写在 table 或 tr 上基本等于没写。
text-align 只对 td/th 有效，table 上设了也白设
浏览器不会把 table 当作文本容器，所以 table { text-align: center } 不会让里面文字居中——td 默认继承 inherit，而 table 自身没有实际的 text-align 值（或默认是 left），结果还是左对齐。
- 正确写法：
td, th { text-align: right; }或单个单元格加<td style="text-align: center"> <li>禁用 <code>align="center"这类 HTML 属性，HTML5 已废弃，W3C 验证通不过，某些 WebView 还会和 CSS 冲突 - 如果用了 UI 框架（如 Ant Design），检查 computed styles，常见干扰是
td { text-align: left !important; } - 必须写在
td或th上：<td style="text-align: center; vertical-align: middle">内容</td> - 别写在
tr上——tr { vertical-align: middle }完全无效 - 看起来没居中？大概率是
padding不一致、line-height太小，或单元格height被硬设得太紧（比如height: 20px） - 多行文本时，
vertical-align: middle对齐的是“整行盒”的中点，不是每行文字中心，这是正常行为 - 必须配合等宽字体：
font-family: 'SFMono-Regular', Consolas, monospace; - 确保数据干净：
<td>-123.45</td>，不是<td> −123.45 </td>（注意前后空格和减号类型） - 避免在
td里套div并设display: flex——text-align在 flex 容器里完全失效 - 若用了
border-collapse: collapse，不影响居中逻辑，但能减少双线干扰视觉判断 - 最稳妥：
table { margin: 0 auto; width: 800px; }（需指定宽度） - 响应式场景可用：
div { text-align: center; } > table { display: inline-block; } - 现代布局推荐父容器用 Flex：
div { display: flex; justify-content: center; } - 别用
table align="center"，已废弃，且语义混乱
vertical-align 必须配 text-align 才算真正居中
text-align: center 只管左右，vertical-align: middle 才管上下；但后者只对单元格内的“行内盒”起作用，不是对整个内容块。
右对齐数字时，text-align:right 只是第一步
单纯右对齐，小数点和负号容易错位，尤其混入全角空格或 Unicode 减号（−）时。
立即学习“前端免费学习笔记（深入）”；
整张表在页面中水平居中，不是靠 text-align
想让整个 table 在页面中间，不是调单元格文本，而是调表格这个块级元素的位置。
真正麻烦的从来不是怎么写那两行 CSS，而是搞清「谁在控制谁」——text-align 管的是单元格内部的文本流，vertical-align 管的是单元格内部的行内盒对齐，而整表居中是块级布局的事。三者作用域完全不同，混在一起改只会越调越乱。
