如何用HTML编写化学式? [英] How to write chemical formulas in HTML?

问题描述

如何用HTML编写下面的内容?

How to write the below ion in HTML?

我已经尝试了下面的代码，但是看起来不太好

I already tried the below code but it doesn't look good

<sup>119</sup><sub>50</sub>Sn<sup>2+</sup>

¹¹⁹ ₅₀ Sn ^{2 +}

¹¹⁹₅₀Sn²⁺

推荐答案

您可以使用MathML，这可能有点冗长.从技术上讲，这不是HTML，而是XML.但是，某些浏览器本机支持，例如Safari和Firefox.不幸的是，Chrome不支持此功能，但是通过包含 MathJax 脚本，可以将其转换为纯HTML.

You can use MathML, which may be a bit verbose. This is technically not HTML, but XML. However, it is supported natively by some browsers, such as Safari and Firefox. Unfortunately, Chrome does not support this, but by including a MathJax script, it can be converted to pure HTML.

<math class="chem">
  <mmultiscripts>
    <mi>Sn</mi>                            <!-- base expression -->
    <none />                               <!-- postsubscript -->
    <mrow><mi>119</mi><mo>+</mo></mrow>    <!-- postsuperscript -->
    <mprescripts />
    <mn>50</mn>                            <!-- presubscript -->
    <mn>119</mn>                           <!-- presuperscript -->
  </mmultiscripts>
</math>

<hr>

<!-- For browsers that do not support MathML: -->
<script id="s"></script><button onclick="s.src='https://cdn.jsdelivr.net/npm/mathjax@2/MathJax.js?config=MML_CHTML'">Load MathJax Script</button>

更多有关mmultiscripts的信息: https://developer.mozilla.org/zh-CN/docs/Web/MathML/Element/mmultiscripts

More on mmultiscripts here: https://developer.mozilla.org/en-US/docs/Web/MathML/Element/mmultiscripts

一些MathML示例: https://www.w3.org/Math/XSL/csmall2.xml

Some MathML examples: https://www.w3.org/Math/XSL/csmall2.xml

这篇关于如何用HTML编写化学式?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！