最稳方式是给 td 或 th 直接加 style="text-align: right;"；整表右对齐用 table td, table th { text-align: right; }；单列推荐加类名如 num-col 配 CSS；Grid/Flex 中用 justify-self: end 或 margin-left: auto；注意可访问性与优先级覆盖问题。
table 中的单元格内容怎么右对齐
直接给 td 或 th 加 style="text-align: right;"，这是最稳、兼容性最好、也最不容易出错的方式。CSS 的 text-align 就是干这个的，别绕弯。
- 别用
align="right"属性——HTML5 已废弃，部分浏览器可能不渲染 - 如果整张表都要右对齐，可以统一写
table td, table th { text-align: right; }，但注意这会影响所有单元格，包括表头 - 如果只对某列右对齐，更推荐加类名，比如
123 .num-col { text-align: right; }，语义清晰、便于维护
用 CSS Grid 或 Flex 布局替代 table 时右对齐难不难
不难，但逻辑变了：Grid/Flex 里没有“单元格对齐”概念，而是靠容器的 justify-content 或子项的 margin-left: auto 推过去。
- Grid 场景下，若一行中只有一个元素想靠右，给它加
justify-self: end; - Flex 场景下，让某个子项右贴边，常用
margin-left: auto;（前提是父容器是display: flex） - 注意：这些方式在表格语义场景（比如数据报表）里反而容易翻车——屏幕阅读器、打印样式、Excel 导出都可能失效，别为了“看起来整齐”牺牲可访问性
为什么有时候加了 text-align: right 还不生效
大概率是 CSS 优先级或继承被覆盖了，尤其是用了 UI 框架（如 Bootstrap、Ant Design）之后。
- 检查是否被更具体的规则覆盖，比如
td { text-align: left !important; }—— 别滥用!important，先看 computed styles - 某些框架会给
td设了text-align: inherit，导致它去继承父级（比如table）的值，而父级没设，默认就是 left - 内联样式（
style="..."）优先级高于外部 CSS，但低于带!important的规则；调试时右键“检查元素”，直接看“Computed”面板里的text-align实际值
数字列右对齐的细节陷阱
纯数字右对齐很常见，但小数点没对齐、负号位置飘、全角空格混入，都会让视觉混乱。
立即学习“前端免费学习笔记（深入）”；
- 用等宽字体（如
font-family: 'SFMono-Regular', Consolas, monospace;）能提升数字列可读性 - 负数显示为
-123.45而不是−123.45（后者是 Unicode 减号，宽度可能不同） - 避免在数字前后加空格或全角字符，
123.45 - 真要小数点对齐，
text-align: right不够用，得用text-align: char; char: ".";（仅 Firefox 支持），生产环境慎用
