最稳方式是用td:nth-child(n)或th:nth-child(n)加text-align:right；align="right"已废弃，w3c报错、框架重置、浏览器解析不一致且违反语义分离原则。
直接用 td:nth-child(n) 或 th:nth-child(n) 选择器加 text-align: right，是最稳、最语义清晰、也最不容易被框架覆盖的方式。
为什么不用 align="right" 属性？
HTML5 已彻底废弃 align 属性。写 <td align="right"> 在 Chrome 可能还凑合，Firefox 新版会忽略，Ant Design 或 Bootstrap 等框架默认重置了它，结果就是“写了等于没写”。W3C 验证器直接报错，也不利于可访问性和长期维护。
<ul><li>
<code>align 在 <table> 上控制的是表格自身浮动（非内容对齐），在 <code><td> 上是历史遗留行为，现代标准不保证一致
<li>浏览器解析优先级混乱：内联 <code>align 和 CSS text-align 冲突时，不同引擎处理方式不同
td:nth-child(2) { text-align: right; } 怎么写才不踩坑？
这是目前兼容性最好、选择最精准的列级控制方式。关键在于匹配范围要包含表头和数据单元格，否则表头还是左对齐。
- 必须同时写
td:nth-child(2), th:nth-child(2)，不然只有数据行右对齐，表头仍居中或左对齐 - 别写成
tr td:first-child——这只影响每行第一个<td>，如果 <code><thead> 里有 <code><th>，它根本不会被选中 <li>别用 <code>:nth-of-type()——<th> 和 <code><td> 是不同类型，在混排结构下极易漏选 <li>示例：<pre class="brush:php;toolbar:false;">td:nth-child(2), th:nth-child(2) { text-align: right; }</pre> → 第二列（含表头）全部右对齐</li> <h3>用 <code><col>标签预设列样式靠谱吗？靠谱，但有硬性限制：它只对未被单元格自身样式覆盖的情况生效，且仅支持
text-align、width、background等极少数属性。-
<col>必须放在<table> 开始后、<code><thead> 或 <code><tr> 之前，顺序严格对应列数 <li>写法：<pre class="brush:php;toolbar:false;"></pre> <table> <col style="text-align: right;"> <col> <tbody>...</tbody> </table> </li> <li>IE8+ 支持完整，但部分旧 Android WebView 对 <code>style属性支持不稳定，生产环境建议搭配类名兜底 - 不能写
vertical-align或font-family——<col>不支持这些 - 检查浏览器开发者工具的 “Computed” 面板，看最终生效的
text-align值是不是left，以及它来自哪条规则 - Ant Design 默认给
td设了text-align: inherit，而父级（比如tr）没设值，就会回退到全局left - Bootstrap 的
.text-right类可能被更宽泛的选择器（如table td）覆盖，得提高 specificity，比如写成table td.text-right - 内联
style="text-align: left"优先级高于外部 CSS，但低于带!important的规则——调试时先搜有没有!important覆盖
为什么加了
text-align: right还是左对齐？大概率不是代码写错了，而是被更高优先级规则覆盖了，尤其在用了 UI 框架之后。
真正难的不是怎么写右对齐，而是怎么让数字列的小数点纵向对齐——
text-align: right只管末尾对齐，字符宽度不一就会飘。这时候得切到等宽字体 + 统一格式化，或者接受 Firefox 专属的text-align: char; char: "."（别上生产）。 -
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
