ruby标签的line-height必须显式设置为无单位数值1.8，因浏览器不继承父级行高且计算不一致；rt需同步设font-size: 0.6em和line-height: 1；多ruby需外层包裹nowrap容器；导出PDF前须JS降级为“汉(hàn)”格式。
ruby标签的line-height必须显式设置，否则Firefox/Safari会压字或留白失控
浏览器对ruby的行高继承极不可靠——它不继承父元素的line-height，也不按自身字号自动计算。直接写p { line-height: 1.6; }，里面的ruby很可能仍用默认normal（Chrome≈1.15，Firefox≈1.2，Safari≈1.08），导致拼音贴底、被裁或上下空隙爆炸。
实操建议：
立即学习“前端免费学习笔记（深入）”；
-
ruby必须单独设line-height: 1.8（至少比汉字字号大0.6），这是防贴底的底线值 - 避免用
px或em单位：比如line-height: 24px在字号缩放时会失效；统一用无单位数值 - 若父容器已设
line-height: 1.5，仍需覆盖：ruby { line-height: 1.8 !important; }，别指望继承 - 旧版 Safari（≤16）对
ruby行高支持更弱，1.8是经实测能兜住的最小安全值
rt的font-size和line-height必须协同调，单设一个等于白干
rt的font-size: 0.5em或50%在不同引擎下缩放比例不一致：Chrome可能缩到48%，Firefox缩到52%，结果就是同一段代码在两个浏览器里拼音高度差一截。更糟的是，如果只调font-size却忽略line-height，Firefox会把rt行高拉得极高，上下留白失控。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 强制写
rt { font-size: 0.6em; }，不用百分比或50% - 必须加
rt { line-height: 1; }，切断浏览器对rt行高的默认干预 - 禁用
rt { vertical-align: top/bottom; }——这会破坏基线锚点，让ruby-align: center失效 - 不要给
rt设margin或padding：它会干扰内联布局，且导出PDF时直接消失
多字连续ruby在窄容器中换行错位，white-space: nowrap不是万能解
连续多个ruby（如<ruby><rb>重</rb><rt>chóng</rt></ruby><ruby><rb>庆</rb><rt>qìng</rt></ruby>）在小屏或窄列里容易断成“重
（拼音）庆（拼音）”，字-音对应关系断裂。很多人直接套white-space: nowrap，但 iOS Safari 17.4 在contenteditable区域里会忽略它，Android WebView 也可能失效。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 外层包一层
span或div，设white-space: nowrap，而非直接作用于ruby本身 - 对整组注音容器加
font-size: 0，再对每个ruby单独设font-size: 16px，可消除子元素间默认空白间隙 - 响应式断点下主动降级：手机端
max-width: 480px时，用JS把ruby转为“汉(hàn)”格式，避免换行风险 - 禁用
ruby { display: inline-flex; }——语义丢失，屏幕阅读器无法识别注音关系
导出PDF或打印时ruby完全消失，CSS无法补救
wkhtmltopdf、Puppeteer、系统打印预览、Outlook Desktop 等环境根本不解析ruby相关标签。它们不是“渲染不好”，而是压根没实现ruby布局模块。此时任何line-height或ruby-align设置都无效，rt内容直接从DOM里蒸发。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 导出前必须用JS遍历所有
ruby，生成降级文本：汉<span class="pinyin">(hàn)</span>，再替换原结构 - 别依赖
rp标签做fallback：Outlook等邮件客户端对rp支持极差，括号常不显示 - Vue/React中禁止用
v-html或dangerouslySetInnerHTML拼接ruby字符串——含&或会结构断裂 - 关键场景（如考试题、操作指引）避免用
ruby承载不可降级的信息，拼音只是辅助，不是主内容
最易被忽略的一点：所有样式必须作用于ruby和rt本身，而不是靠父容器继承。哪怕你写了body { line-height: 1.8; font-size: 16px; }，ruby也大概率不认——它有自己的排版引擎，得亲手喂参数。
