rtc 属性在主流浏览器中不被支持，html 标准中也不存在该属性；它很可能是对 rt 的误写、旧草案混淆或非标准扩展，实际无效且不应出现在生产代码中。
rtc 属性在当前主流浏览器中**不被支持**，HTML 标准里也**没有 rtc 这个属性**。你看到的“rtc”很可能是对 rt 的误写、拼写错误，或是混淆了已废弃的旧草案（如 XHTML 1.1 Ruby Annotation Module 中曾提过但从未被实现），又或者来自某个非标准 polyfill 库的私有扩展——它不会生效，也不该出现在生产代码中。
为什么找不到 rtc？浏览器根本不认这个属性
查 MDN、WHATWG HTML Living Standard、Can I Use，均无 rtc 相关条目。Chrome、Firefox、Safari、Edge 的开发者工具中设置 rtc="xxx" 后，元素上既无 DOM 属性反映，也无样式或行为变化。它不是拼写变体（比如 rt 是标准标签，rtc 不是），也不是实验性属性（Chrome 的 chrome://flags 或 Firefox 的 about:config 均无对应开关）。
- 常见误源：把
<rt></rt>标签名错记为rtc；或把 CSS 的ruby-text-container（一个早已被移除的旧草案概念）简写成rtc - 真实标准只有：
<ruby></ruby>、<rb></rb>、<rt></rt>、<rp></rp>，且<rb></rb>和<rt></rt>必须一一紧邻嵌套 - 若你在某篇博客或代码片段里看到
rtc，大概率是作者笔误，或复制粘贴时多打了c
想实现复杂注音？用标准 rb+rt 组合 + CSS 微调
所谓“复杂布局”，比如多音字对照、声调分色、轻声小号、连读提示，并不需要虚构属性。标准结构足够支撑，关键是写法严谨、CSS 克制：
- 多音字并列标注：用多个
<rb></rb>+<rt></rt>并排，如<ruby><rb>长</rb><rt>cháng</rt><rb>长</rb><rt>zhǎng</rt></ruby> - 声调单独控制：给每个
<rt></rt>加 class，如<rt class="tone4">hào</rt>，再用 CSS 设.tone4 { color: #e74c3c; } - 轻声缩放：不用全局
font-size，而是rt[data-tone="light"] { font-size: 0.55em; }，配合<rt data-tone="light">men</rt> - 避免用
position: absolute模拟“下方注音”——改用标准ruby { ruby-position: under; }（Safari 17.4+、Chrome 122+ 已支持）
动态生成时最容易踩的坑：结构断裂 & 语义丢失
服务端模板或前端框架（Vue/React）里拼字符串生成 <ruby></ruby>，稍不注意就破坏嵌套关系：
- 错误示例（Vue）：
v-html="`<ruby>${char}<rt>${pinyin}</rt></ruby>`"—— 若char含&或，会解析失败甚至 XSS - 正确做法：封装为组件，模板固定结构，props 仅传纯文本值，如
<ruby-pair :char="'重'" :pinyin="'chóng'"></ruby-pair> - React 中特别注意：
<rt></rt>必须是<ruby></ruby>的**直接子节点**，中间不能插<span></span>或 Fragment —— 否则语义失效，屏幕阅读器跳过注音 - 导出 PDF 或打印时，
<ruby></ruby>会被多数引擎忽略，需 JS 运行时 fallback：遍历所有ruby，提取rb文本和对应rt内容，生成汉(hàn)形式插入 DOM
真正复杂的点不在属性名，而在结构必须严格、样式必须克制、动态生成必须隔离 HTML 注入风险——rtc 不存在，但把 rb 和 rt 写对、管住 CSS、绕开框架陷阱，才是实际开发中最容易卡住的地方。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
