HTML中正确上标标签是<sup>，非\_SUP；仅用于幂次、化学式、脚注等语义场景，禁用嵌套，需配合line-height和font-size比例确保渲染稳定，复杂公式应改用KaTeX。
别搜“_SUP”，HTML里根本没有这个标签
浏览器根本不认识 _SUP，写了等于白写。你看到的“没效果”或“文字乱跑”，八成是因为把 Word 里的快捷键（比如 Ctrl+Shift+=）当成了 HTML 语法。真正可用的是 <sup>——注意是尖括号、全小写、没下划线。
<sup>该用在哪些地方？不是所有“小一点偏上的字”都适合
它只负责语义，不负责“好看”。用错地方，反而害 accessibility 和 SEO。
- 该用：
x<sup>2</sup>（数学幂次）、H<sub>2</sub>O（化学式里的下标）、参见文献<sup>1</sup>（脚注编号）、TM<sup>™</sup>（商标符号） - 不该用：
2024<sup>年</sup>（年份不是上标语义）、免责声明<sup>小字说明</sup>（纯样式需求）、a<sup>n</sup><sub>i</sub>（顺序错，应为a<sub>i</sub><sup>n</sup>才表示 aᵢⁿ） - 特别注意：
<sup>不能嵌套，比如<sup><sup>2</sup></sup>是非法 HTML，部分浏览器会静默修复，但行为不可靠
怎么让 <sup> 在不同设备上不跳、不错位？
移动端缩放后上标“飘走”，不是标签问题，是 vertical-align 计算在 subpixel 渲染下的精度漂移。别硬调 top 或 transform，那会破坏语义和屏幕阅读器识别。
- 给含
<sup>的段落设固定line-height，比如line-height: 1.6 - 微调字号比例比改
font-size更安全：用font-size: 0.8em而非font-size: 12px - 避免在
<sup>里塞长文本，它只适合单字符或极简符号（如<sup>®</sup>可以，<sup>注册商标</sup>不行） - 若需精确对齐 SVG 图标或按钮内文，用
vertical-align: text-top或vertical-align: middle替代默认的super，但要同步检查屏幕阅读器是否仍能正确播报
复杂公式别硬扛，<sup> 不是 MathML 替代品
2<sup>10</sup> 看起来像 2¹⁰，但实际是两个独立字符拼在一起。遇到 x^{n+1}、分数、根号，<sup> 就彻底失效。
立即学习“前端免费学习笔记（深入）”；
- 简单幂次（单层、无运算符）：放心用
<sup> - 含括号、加减、上下标混合：必须换方案，推荐 KaTeX —— 只需引入两行资源，写
\(x^{n+1}\)就能渲染 - 已用
<sup>的旧页面，别全量重写，但新增数学内容一律走 KaTeX - MathML 虽标准，但 Chrome 对它的支持至今不稳定，除非项目强依赖语义化输出（如学术数据库导出），否则不建议主推
真正容易被忽略的，是语义和样式的边界：一个标签写下去，到底是告诉机器“这是指数”，还是仅仅想让它“看起来小一点往上飘”。前者用 <sup>，后者就该交给 CSS。
