text-align-last对单行表格文本基本无效，因表格单元格默认单行渲染，无“最后一行”概念；它仅在text-align: justify生效且文本自动换行时触发，单独设置或用于短标题、数字列等无效。
text-align-last 对单行表格文本基本无效
直接给 th 或 td 设 text-align-last: justify，几乎不会起作用——因为表格单元格里的文本默认是单行渲染，没有“最后一行”的概念；text-align-last 只在 text-align: justify 生效且文本发生自动换行（或有强制换行符）时才触发。
常见错误现象：text-align: justify; text-align-last: justify; 写上去后，短标题、数字列、英文单词列完全没变化，甚至 Safari 直接忽略该声明。
- 必须同时设置
text-align: justify才可能激活 - 中文连续无空格时，
justify 默认不拆字，末行对齐失效 → 需配合 <code>word-break: break-all或overflow-wrap: break-word - 表格中多数场景是单行内容，
text-align-last天然不适用，强行用反而增加兼容性风险
中英文混排表格推荐用 text-align + vertical-align 组合
中英文对齐的核心矛盾不是“两端”，而是“基线不一致”和“字宽差异”。比如中文字符方正、英文小写字母有升部降部，单纯居中会视觉偏上；金额列右对齐时，中文单位（如“元”）和英文符号（如“USD”）宽度不同，容易错位。
可靠做法是分层控制：
-
th统一设text-align: center; vertical-align: middle;，避免表头悬浮感 - 数据列按语义区分：
td.num用text-align: right;，td.name用text-align: left; - 中英文并存的单元格（如“订单号 Order ID”），加
font-family: system-ui, -apple-system, "Segoe UI", sans-serif;保证等宽感，再配padding: 8px 12px;缓冲视觉拥挤 - 避免对整张
table设text-align，它不生效；只作用于th、td或具体类名
需要真·两端对齐？用伪元素兜底比 text-align-last 更稳
只有极少数场景真需要单行两端对齐：比如发票抬头、合同签署栏、报表页脚说明行。这时 text-align-last 不可靠，尤其在 Safari 和部分邮件客户端里。
推荐写法（兼容性实测覆盖 Chrome 120+、Firefox 125+、Safari 17.5+、Outlook 2021）：
.justify-line {
text-align: justify;
}
.justify-line::after {
content: "";
display: inline-block;
width: 100%;
}
原理：伪元素强制创建“第二行”，让 text-align: justify 有作用对象，从而拉伸第一行字间距。注意：
- 不能用于
th或td上带white-space: nowrap的情况 - 中文连写时仍需
word-break: break-all配合，否则末字卡在右边不动 - 如果单元格有背景色或边框，伪元素会撑高行高 → 加
line-height: 1;抑制
容易被忽略的垂直对齐细节
很多人调了 text-align 就以为对齐完成了，但中英文混排时，vertical-align: middle 在不同字体下实际位置差异很大——尤其是用了非系统默认字体（如思源黑体、HarmonyOS Sans）后，中文 baseline 会上移，英文看起来像“吊着”。
稳妥方案：
- 优先用系统字体栈，减少 baseline 偏移
- 对关键列（如含“¥”“USD”“件”“pcs”）单独加
vertical-align: text-bottom;或vertical-align: 2px;微调 - 避免在
tr上设vertical-align，它不继承；必须写在td或th上 - 表格行高未显式设置时，
vertical-align: middle效果不可控 → 建议统一设line-height: 1.5;和height: auto;
最复杂的不是怎么写，而是意识到：表格对齐从来不是纯 CSS 属性堆砌，而是字体、行高、字宽、换行策略共同作用的结果。一个 text-align-last 写错位置，可能整行数据在 Outlook 里全挤到左边。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
