HTML5 MathML|程序员教程

HTML5 MathML（数学标记语言）

创建简单的数学公式

要开始使用 MathML，首先需要向 HTML 文档中添加 <math> 标签。然后构建基本的数学表达式，如分数或平方根。

                <!DOCTYPE html>
                <html lang="en">
                <head>
                    <meta charset="UTF-8">
                    <meta http-equiv="X-UA-Compatible" content="IE=edge">
                    <meta name="viewport" content="width=device-width, initial-scale=1.0">
                    <title>HTML5 MathML 教程</title>
                </head>
                <body>
                    <math xmlns="http://www.w3.org/1998/Math/MathML">
                        <mfrac>
                            <mn>1</mn>
                            <mn>2</mn>
                        </mfrac>
                    </math>
                </body>
                </html>

在此示例中，我们使用了以下 MathML 元素：

<math>：包含所有其他 MathML 元素的容器。
<mfrac>：用于创建分数。
<mn>：用于表示数字。

请注意，<math> 元素的 xmlns 属性是必需的，以便浏览器正确解析 MathML。

使用操作符、变量和上下标

MathML 提供了丰富的元素来表示各种数学符号和结构。以下是创建具有操作符、变量和上下标的复杂数学表达式的一些示例。

添加操作符

使用 <mo> 元素表示数学操作符，如加法或乘法。

                <math xmlns="http://www.w3.org/1998/Math/MathML">
                    <mn>3</mn>
                    <mo>+</mo>
                    <mn>4</mn>
                </math>

使用变量

使用 <mi> 元素表示数学变量，如 x 或 y。

                <math xmlns="http://www.w3.org/1998/Math/MathML">
                    <mi>x</mi>
                    <mo>=</mo>
                    <mfrac>
                        <mrow><mo>-</mo><mi>b</mi><mo>±</mo></mrow>
                        <mroot>
                            <mrow><mi>b</mi><mo>^</mo><mn>2</mn><mo>-</mo><mn>4</mn><mi>a</mi><mi>c</mi></mrow>
                            <mn>2</mn>
                        </mroot>
                    </mfrac>
                </math>

添加上标和下标

使用 <msup> 和 <msub> 元素分别添加上标和下标。

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

使用括号和方程组

MathML 支持各种括号类型，以及垂直对齐的多行表示，如方程组。

添加括号

使用 <mfenced> 元素添加括号。

                <math xmlns="http://www.w3.org/1998/Math/MathML">
                    <mfenced open="(" close=")">
                        <mrow>
                            <mi>x</mi>
                            <mo>+</mo>
                            <mi>y</mi>
                        </mrow>
                    </mfenced>
                </math>