HTML5 - MathML

MathML (Mathematical Markup Language，数学标记语言) 是一种基于 XML 的语言，用于描述数学符号表示法并捕获其结构和内容。它的目标是使得数学内容可以在万维网 (World Wide Web) 上得到呈现、接收和处理，就像 HTML 使得文本内容得以实现一样。

HTML5 允许使用 <math> 标签将 MathML 元素直接嵌入到 HTML 文档中，这类似于使用 <svg> 标签嵌入 SVG。这使得数学表达式可以被视为网页内容的一部分，而不是静态图片。

浏览器支持

浏览器对 MathML 的原生支持已显著改善，但仍可能有所不同。截至最新版本：

Firefox 和 Safari： 通常对显示 MathML 有良好且长期的支持。
基于 Chromium 的浏览器（Chrome, Edge）： 已添加并显著改进了支持（MathML Core 实现）。旧版本可能支持有限或不支持。
Internet Explorer： 不支持 MathML。

对于缺乏原生支持或为确保一致渲染的浏览器，通常使用像 MathJax (https://www.mathjax.org/) 这样的 JavaScript 库。MathJax 可以解析 MathML（以及 LaTeX 等其他格式），并使用 HTML/CSS 或 SVG 进行渲染，提供出色的跨浏览器兼容性和高质量的排版效果。

在 HTML5 中嵌入 MathML

你可以在 <math> 标签内嵌入 MathML 代码。从技术上讲，在 HTML5 中不强制要求使用 xmlns 属性，但通常会包含它以兼容 XML 工具。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>MathML Example</title>
</head>
<body>

    <h1>Pythagorean Theorem in MathML</h1>

    <math xmlns="http://www.w3.org/1998/Math/MathML">
        <msup>
            <mi>a</mi>
            <mn>2</mn>
        </msup>
        <mo>+</mo>
        <msup>
            <mi>b</mi>
            <mn>2</mn>
        </msup>
        <mo>=</mo>
        <msup>
            <mi>c</mi>
            <mn>2</mn>
        </msup>
    </math>

    <h1>Quadratic Formula</h1>

    <math display="block" xmlns="http://www.w3.org/1998/Math/MathML">
      <mrow>
        <mi>x</mi>
        <mo>=</mo>
        <mfrac>
          <mrow>
            <mo form="prefix">-</mo>
            <mi>b</mi>
            <mo>&PlusMinus;</mo>
            <msqrt>
              <mrow>
                <msup>
                  <mi>b</mi>
                  <mn>2</mn>
                </msup>
                <mo>-</mo>
                <mn>4</mn>
                <mo>&InvisibleTimes;</mo> <!-- 或使用 <mi>a</mi><mi>c> -->
                <mi>a</mi>
                <mo>&InvisibleTimes;</mo>
                <mi>c</mi>
              </mrow>
            </msqrt>
          </mrow>
          <mrow>
            <mn>2</mn>
            <mo>&InvisibleTimes;</mo>
            <mi>a</mi>
          </mrow>
        </mfrac>
      </mrow>
    </mathdisplay>

</body>
</html>

<math> 标签上的 display="block" 属性表示将表达式渲染为块级元素（如段落），而不是内联元素。

核心 MathML 元素（表现性标记 - Presentation Markup）

MathML 主要有两种变体：表现性 MathML (Presentation MathML，侧重数学符号的外观) 和内容性 MathML (Content MathML，侧重数学含义)。表现性 MathML 更常用于直接在浏览器中显示。一些核心元素包括：

<math>: 根元素。
<mi>: 标识符（如变量 ‘x’，函数名 ‘sin’）。
<mn>: 数字（如数字字面量 ‘2’, ‘3.14’）。
<mo>: 运算符、定界符、分隔符（如 ’+’, ’=’, ’(’, ’{’, ’,’）。
<mtext>: 文本（用于在数学表达式中嵌入描述性文本）。
<mspace>: 表示空间。
<msup>: 上标（基数后跟上标）。
<msub>: 下标（基数后跟下标）。
<msubsup>: 同时包含下标和上标。
<mfrac>: 分数（分子后跟分母）。
<msqrt>: 平方根。
<mroot>: 带显式指数的根（根号内的数后跟指数）。
<mfenced>: 用定界符（如圆括号或方括号）环绕内容，由 open 和 close 属性指定。
<mtable>: 创建表格或矩阵（包含 <mtr> 行和 <mtd> 单元格）。

像 <mrow> 这样的布局模式元素 (Layout Schemata elements) 用于水平地对子表达式进行分组。

数学符号（实体 - Entities）

MathML 使用标准的 XML/HTML 字符实体来表示许多数学符号。常见的例子包括：

⁢ (或 ⁢)：表示省略乘号的乘法（如 ‘2x’）。
⁡ (或 ⁡)：函数应用（如 ‘f(x)’）。
&PlusMinus; (&pm;)：± 符号。
∑, ∫：求和符号 (∑) 和积分符号 (∫)。
∀, ∃：全称量词 (∀) 和存在量词 (∃)。
α, β, π：希腊字母 (α, β, π)。

另外，如果你的文档编码是 UTF-8，你通常也可以直接使用 Unicode 字符。

示例：矩阵

<math xmlns="http://www.w3.org/1998/Math/MathML">
  <mi>A</mi>
  <mo>=</mo>
  <mfenced open="[" close="]">
    <mtable>
      <mtr>
        <mtd><mi>x</mi></mtd>
        <mtd><mi>y</mi></mtd>
      </mtr>
      <mtr>
        <mtd><mi>z</mi></mtd>
        <mtd><mi>w</mi></mtd>
      </mtr>
    </mtable>
  </mfenced>
</math>

这段代码表示矩阵 A = [ [x, y], [z, w] ]。

可访问性 (Accessibility)

MathML 的主要好处之一是其可访问性。屏幕阅读器和其他辅助技术可以解释 MathML 结构，从而正确地大声朗读方程式，这对于静态方程式图片来说是不可能的。

何时使用 MathML

当你需要在 Web 上语义化且可访问地显示数学符号时，可以使用 MathML。对于复杂或高度交互的数学内容，或为确保跨浏览器的一致性，可以考虑使用 MathJax 等库。

有关详细信息，请参阅 W3C MathML 规范 (https://www.w3.org/TR/MathML4/) 和 MDN Web Docs 关于 MathML 的文档 (https://developer.mozilla.org/en-US/docs/Web/MathML)。