HTML常用文本标签怎么实现上下标？数学公式与化学式排版-html教程-PHP中文网

必须用和实现上下标以保留语义：屏幕阅读器可读、纯文本粘贴保留unicode、seo可识别；化学式如h₂o、so₄²⁻需分层标注，禁嵌套；数学复杂公式应改用mathml或katex；css仅调font-size和vertical-align（em单位），禁设line-height。

html常用文本标签怎么实现上下标？数学公式与化学式排版

用 `` 和 `` 标签实现上下标，不是 CSS 模拟

必须用  和 ，而不是 vertical-align: super 或 font-size 手动调位置。前者带语义：屏幕阅读器会读“上标2”“下标4”，复制到纯文本时能保留 Unicode 下标字符（如 H₂O → “H₂O”），SEO 也能识别上下文；后者只是视觉欺骗，粘贴出来就是 H2O，辅助技术完全无视。

常见误用场景包括：单位写成 m2 正确，但写成 m2 就丢语义；脚注编号用 参见文献1 合理，用 CSS 模拟则无法被引用解析工具识别。

`` 写化学式时数字不能脱离元素符号

化学式中下标数字必须紧贴对应元素，且不能把整个分子式包进一个 。比如 H₂O 要写成 H2O，不是 H2O，更不是 H2O（O 不是下标）。

多原子基团需分层处理：SO₄²⁻ 应写为 SO42−，其中 4 是下标（原子个数），2− 是上标（电荷）。不要写成 SO42− —— 这属于嵌套  里套 ，虽浏览器可能渲染出来，但语义混乱，校验失败，且在 SSR 或严格 XHTML 环境下会出错。

错误：CO23（两个独立 ，中间无连接）
错误：CO2（把字母和数字一起下标，违背化学排版惯例）
正确：CO2、NH4+、PO43−

数学公式里 `` 和 `` 只负责单层，别硬撑复杂表达式

 和  是为简单幂次、脚标、单位设计的，比如 x2、an、cm−3。遇到多层（abc）、积分上下限、分式或带括号的指数（(x+y)2），视觉上可能勉强可读，但语义已失效，渲染也容易错位。

html-ppt-to-pdf

将使用 `

` 约定的 HTML 幻灯片转换为高保真、矢量文本 PDF（使用 Playwright + Chromium 原生 PDF 功能）。

下载

例如 E=mc2 没问题，但 log10(x) 中的括号如果也想变小， 无法控制括号大小，强行套 log10(x) 会把括号变成上标，彻底错误。

此时应换 MathML 或 KaTeX：它们支持完整数学语义，能正确导出、缩放、语音朗读。硬用 / 写 ∑i=1n 类似结构，不仅难维护，还会在高 DPI 屏幕或缩放时出现基线偏移。

微调样式只改 `font-size` 和 `vertical-align`，别碰 `line-height`

浏览器默认给  设了 font-size: 75% 和 vertical-align: super， 类似但用 sub。如需统一调整，CSS 只该覆盖这两个属性：

sup, sub {
  font-size: 65%;
  vertical-align: 0.25em;
}

注意：vertical-align 必须用 em 单位（不是 px），否则页面缩放时角标会漂移；line-height 绝对不能设，它会破坏段落整体行高，导致上下文文字挤压或截断。另外， 和  之间别加空格，mol-1s-1 正确，mol -1 s-1 会在单位间留明显间隙。

真正容易被忽略的是嵌套顺序：要加粗 E_g，写 Eg，而不是 g —— 后者会让  的样式继承异常，字体大小和对齐都可能错乱。