rp标签本身不渲染可见内容，仅在浏览器不支持ruby时显示其内部文本（如括号）以实现降级；必须成对嵌套于ruby中、紧邻rt，其显隐由浏览器内置规则决定而非CSS或JS。
rp 标签的作用不是“提供降级括号”
直接说结论：rp 标签本身不渲染任何可见内容，也不自动插入括号；它只是配合 ruby 结构，在浏览器不支持注音显示时，让括号（或其他包裹符号）有条件地显示。真正起降级作用的是 rp 内部的文本（比如 ( 和 )），而它的可见性由浏览器对 ruby 的支持程度决定。
正确写法：rp 必须成对出现在 ruby / rt 两侧
常见错误是单独用 rp 或把它当普通容器。它必须嵌套在 ruby 中，且紧邻 rt 元素——通常一个 rp 在 rt 前，一个在后，形成括号包裹效果：
<ruby> 汉<rp>(</rp><rt>hàn</rt><rp>)</rp></ruby>
这样写，支持 ruby 的浏览器会隐藏两个 rp，只显示注音；不支持的浏览器则会把 rp 内容（即括号）和 rt 一起按行内文本渲染，变成「汉(hàn)」。
rp 的显示逻辑取决于浏览器是否启用 ruby 渲染
rp 的显示/隐藏不是靠 CSS 或 JS 控制，而是由浏览器内置规则决定：
- 支持
ruby的现代浏览器（Chrome 117+、Firefox 119+、Safari 17.4+）会将rp设为display: none（隐式），仅保留rt作为注音定位 - 旧版或禁用 ruby 支持的浏览器（如 IE、部分 WebView）会把
rp当普通标签，原样输出其文本内容 - 不能用
style="display:block"强制显示rp—— 这会破坏降级逻辑，导致支持 ruby 的浏览器也显示括号
实际兼容性要注意这些细节
即使语法正确，降级效果仍可能失效：
- 某些 Android WebView（尤其旧版）会忽略
rp，既不隐藏也不显示，导致括号丢失 - 如果
rt内容为空，部分浏览器（如 Safari）可能连带跳过rp渲染 -
rp只能包含纯文本或极简内联元素（如），嵌套块级标签会导致解析异常 - 不要依赖
rp实现语义化括号——它本质是样式降级钩子，不是结构化标记
真正稳定的做法是：把括号写在 rp 里，同时确保 rt 非空、ruby 结构闭合完整，其他就交给浏览器判断。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
