javascript - 使用 javascript/jquery 应用上标/下标标签

Question

我正在显示来自 MySQL 数据库的文本，其中包含这样的文本“测量痕量气体 CH4、N2O 和 CO2 以及控制它们的生产和排放的过程”。文本通过文本区域保存。当文本显示在 HTML 文档中时，我想使用 javascript/jquery 将上标/下标应用于 CH4、N20 和 CO2？请让我知道这是否可能？

Answer 1

最简单的方法是处理数据，让数字放在sub里面。标记，例如CH4 变为 CH<sub>4</sub> .然而，这会产生打印不良的结果(包括不均匀的行间距)，所以我建议生成 CH<span class=sub>4</span>并使用 CSS 规则

.sub {
  vertical-align: 0;
  position: relative;
  top: 0.8ex; 
  font-size: 80%;
}

当然，可以根据字体调整使用的值。

其他选项包括使用下标字符(如@TachyonVortex 的回答中所建议的那样)和使用 OpenType 功能使用 font-feature-settings 进行下标(有限的浏览器支持，有限的字体支持)。