ruby-position 是唯一真正影响注音位置的标准 CSS 属性，用于控制 rt 在基字上方（over）、下方（under）或右侧（right）；其他如 ruby-align、ruby-merge 等属废弃草案属性，未被实现；实际排版依赖通用 CSS 组合与语义结构约束。
HTML 中没有 ruby-position 以外的“高级排版控制属性”——所谓“高级”，其实是用标准 CSS 属性组合实现精细控制，而非存在一堆专有属性。
ruby-position 是唯一真正影响注音位置的标准 CSS 属性
它直接告诉浏览器把 rt 放在基字上方（over）、下方（under）或右侧（right，竖排时生效）。其他所谓“控制属性”都是误传或旧草案残留：
-
ruby-position: over是默认值，但显式声明更可靠，尤其在混合 writing-mode 场景下 -
ruby-position: under在 Chrome 122+、Safari 17.4+ 才稳定支持；Firefox 目前仍忽略该值 - 不要尝试
ruby-align或ruby-merge：它们曾出现在早期草案中，但从未被主流引擎实现，MDN 和 WHATWG 标准均无记录 - 任何带
rtc的写法（如rtc="bottom"）纯属无效——浏览器根本不解析该属性，也不报错
真正起作用的是基础 CSS 组合，不是 ruby 专属属性
排版效果取决于对 ruby、rb、rt 分别设置的通用样式，关键点在于覆盖浏览器默认行为：
-
ruby { line-height: 1.8; }：防止rt被压缩进汉字行高里（Firefox 尤其敏感） -
rt { font-size: 0.6em; line-height: 1; }：避免依赖浏览器默认的 50% 缩放（各引擎实现不一致） -
ruby { white-space: nowrap; }：中文混排数字/英文时防断行脱节（如「第123 页」） -
rt { vertical-align: text-top; }：比默认top更稳，减少不同字体 baseline 偏移
动态生成时最容易忽略的结构约束
框架里拼字符串或用 v-html/dangerouslySetInnerHTML 注入 ruby，稍不注意就破坏语义锚点：
立即学习“前端免费学习笔记（深入）”；
-
rt必须是ruby的**直接子元素**，套一层<span>或<div>就失效（React/Vue 模板中常见） -
rb不能省略——即使浏览器渲染看似正常，Safari 17+ 和部分 Android WebView 会错位或合并注音 - 多字必须拆成多个独立
<ruby><rb>X</rb><rt>x</rt></ruby>，不能共用一个rt或用空格分隔 - 拼音含全角字符、中文标点、大写字母时，
rt内容可能被截断或排版溢出（必须用半角小写 Unicode 声调）
最常被绕过的复杂点：打印导出和邮件客户端。wkhtmltopdf、Outlook Desktop 等完全不解析 rt，也不会应用 ruby-position —— 这不是样式问题，是渲染引擎压根没实现该模块。需要 fallback 方案时，得靠 JS 检测 + 替换为括号文本，而不是寄希望于某个“隐藏高级属性”。
