数字右对齐必须用 text-align: right，HTML 的 align 属性在 <td> 上已废弃，现代浏览器忽略或冲突；正确做法是统一用 CSS 控制，配合 font-variant-numeric: tabular-nums 和结构分离（如 <span class="num">123.45</span><span class="unit">¥</span>）实现精准对齐。
数字右对齐必须用 text-align: right，不是 align
HTML 的 align 属性在 <td> 上早已废弃，现代浏览器（Chrome 103+、Firefox 91+、Safari 15.4+）会忽略它，或与 CSS 冲突导致不可预测行为。W3C 验证器直接报错，且无法响应式控制。
正确做法是统一用 CSS：text-align: right 控制水平对齐，它只作用于单元格内的行内内容（如数字、文字），不影响子元素布局。
- 给整列设右对齐：
td:nth-child(3) { text-align: right; }（适合金额、序号列） - 语义化写法更可靠：
<td class="numeric">¥1,234.56</td>+.numeric { text-align: right; } - 表头也需显式声明：
th.numeric { text-align: right; }，因为th默认居中 - 若单元格内含
<div>或<span>，text-align仍生效；但若子元素设了display: flex，该属性就失效了
等宽数字对齐靠 font-variant-numeric: tabular-nums
仅右对齐不够——小数点、负号、千分位符号会错位。真正让 “1.23”、“12.34”、“123.45” 垂直对齐的，是让每个数字字符占相同宽度，即启用等宽数字（tabular numerals）。
font-variant-numeric: tabular-nums 只影响数字 0–9（以及 Unicode 负号 − U+2212 和小数点 .），不改变单位、括号、货币符号的宽度。
立即学习“前端免费学习笔记（深入）”；
- 必须搭配支持该特性的字体：推荐
font-family: "SF Mono", "Fira Code", "IBM Plex Mono", monospace - 常见错误：给整个
<td>¥123.45</td>加该样式，但¥和.宽度不一致 → 整体仍歪斜 - 真实业务中建议拆分：
<span class="num">123.45</span><span class="unit">¥</span>，再分别控制 - 兼容性检查：
getComputedStyle(el).fontVariantNumeric返回"tabular-nums"才算生效；旧版 Safari/Firefox 直接回退为比例数字
混合内容（如 “24 kg”）对齐要结构分离
表格里纯数字少，多是 “数字+单位+文字” 组合。这时单靠 text-align 和 font-variant-numeric 无法解决整体错位，因为单位本身宽度不等（"kg" vs "℃" vs "%"）。
可行解是 HTML 结构层面拆开，把可对齐部分和不可控部分隔离处理：
- 用
<span class="num">24</span><span class="unit">kg</span>替代<td>24 kg</td> -
.num应用font-variant-numeric: tabular-nums+ 等宽字体 +text-align: right -
.unit设固定宽度（如width: 2em）或统一padding-left: 0.5em+text-align: left - 负号若显示为短横
-（U+002D），需手动替换为长负号−（U+2212），或用::before插入
别忘了 vertical-align: middle 和 padding
数字列常被忽略垂直对齐和留白——即使水平对齐完美，单元格高度不一致或文字贴边，视觉上依然“浮”着。
vertical-align: middle 是唯一能控制单元格内内容垂直位置的 CSS 属性，但它只在 <td> 和 <th> 上有效，不能写在 <table> 上。
- 统一设置：
td, th { vertical-align: middle; padding: 8px 12px; } - 若某列含图标或图片，
vertical-align: middle仍适用，但需确保图片有明确尺寸或height，否则可能失效 -
padding不只是美观：太小会让右对齐数字紧贴右边框，误判为未对齐；太大则浪费空间 - 避免用
line-height模拟垂直居中——它依赖字体度量，跨字体/浏览器不稳定
tabular-nums 却没换字体，或没拆 "−17℃"，结果调试半天发现只是 getComputedStyle 返回空字符串——说明压根没生效。 
