table居中需用margin: 0 auto且设明确宽度；align="center"已废弃；text-align和vertical-align须正确作用于th/td而非table/tr；数字右对齐需等宽字体+col定义或格式化补零。
table 元素加 margin: 0 auto 才能让整张表居中
很多人在 <table> 上写 <code>align="center"，结果在 Chrome 最新版或 Firefox 里根本没反应——这个属性在 HTML5 中已废弃，W3C 验证器直接报错，现代浏览器要么忽略、要么行为不一致。
真正起作用的是 CSS 的 margin。但有个硬性前提：table 必须是块级元素（默认就是），且不能有 float、display: inline-table 这类干扰项。
<table style="width: 80%; margin: 0 auto;"> —— 宽度要明确，否则 <code>auto外边距无效- 父容器不能是
display: flex或display: grid，否则margin: 0 auto被忽略 - 如果父容器有
text-align: center，对table本身没用；但它能让display: inline-block的表格居中（备用方案） - 正确写法：
th { text-align: center; }+td { text-align: left; } - 金额列右对齐：
td.amount, th.amount { text-align: right; }，再配合font-family: monospace防小数点错位 - 内联写法仅用于调试：
<td style="text-align: right">¥12,345.67</td>，批量用就失控 -
text-align对<div> 或 <code><img>无效，除非它们是inline或inline-blockvertical-align: middle只对单元格内容生效，不是让整行上下居中常有人以为给
tr加vertical-align: middle就能垂直居中，其实它只作用于td和th内部内容，而且前提是单元格得有“高度空间”——如果内容只有一行字、又没设height或line-height，middle几乎看不出效果。- 基础写法：
td, th { vertical-align: middle; } - 图片文字混排时，
img默认vertical-align: baseline会留白，建议统一写img { vertical-align: middle; } - 单元格里塞了
<div>？<code>vertical-align对它完全无效，得改用display: flex或设div为inline-block - 别在
table或tr上写vertical-align，语法合法但毫无作用 - 解决办法：用等宽字体 + 右对齐：
.numeric { text-align: right; font-family: "Consolas", "Courier New", monospace; } - 更稳的方式：用
<col>标签提前定义列样式，语义清晰且不影响结构：<col class="amount">+col.amount { text-align: right; } - 避免用
<td align="right">，HTML5 已废弃，Firefox 新版直接无视 <li>如果后端吐出的数字没补零（如 <code>123.4vs123.40），前端对齐依然会漂移，得靠格式化函数统一补位
实际项目里，最容易被跳过的其实是单元格高度控制和字体选择。没设最小高度、又用默认字体对齐数字，光调
数字右对齐时，
text-align: right不够，还得管字体和小数点纯靠
text-align: right对齐带小数点的数字（比如123.45和9999.00），在非等宽字体下，小数点会歪斜——因为每个字符宽度不同，右对齐只对齐最右字符，不是对齐小数点。text-align和vertical-align永远看起来“差点意思”。 - 基础写法：
th 和 td 的 text-align 必须分开写
浏览器给 th 默认加了 font-weight: bold 和 text-align: center，而 td 默认是 text-align: left。一旦你全局写 table { text-align: center }，td 是被覆盖了，但语义和可维护性全乱了。
