在HTML5中使用MathML数学公式的简单讲解

时间：2021-05-08

HTML5 的 HTML 语法允许我们在文档内使用 <math>...</math> 标签应用 MathML 元素。

下面是一个使用 MathML 的有效 HTML5 文档：

XML/HTML Code复制内容到剪贴板
  • html
  • <!doctypehtml>
  • <html>
  • <head>
  • <metacharset="UTF-8">
  • <title>Pythagoreantheorem</title>
  • </head>
  • <body>
  • <mathxmlns="http://www.w3.org/1998/Math/MathML">
  • <mrow>
  • <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>
  • </mrow>
  • </math>
  • </body>
  • </html>

    • 这会生成如下结果：


    复制代码代码如下:a2 + b2 = c2
    便于学习这一概念 - 请使用 FireFox 3.7 或更高版本进行在线练习。

    使用 MathML 字符
    想象一下，下面是一个使用字符 &InvisibleTimes; 的标记：

    XML/HTML Code复制内容到剪贴板
  • html
  • <!doctypehtml>
  • <html>
  • <head>
  • <metacharset="UTF-8">
  • <title>MathMLExamples</title>
  • </head>
  • <body>
  • <mathxmlns="http://www.w3.org/1998/Math/MathML">
  • <mrow>
  • <mrow>
  • <msup>
  • <mi>x</mi>
  • <mn>2</mn>
  • </msup>
  • <mo>+</mo>
  • <mrow>
  • <mn>4</mn>
  • <mo>⁢</mo>
  • <mi>x</mi>
  • </mrow>
  • <mo>+</mo>
  • <mn>4</mn>
  • </mrow>
  • <mo>=</mo>
  • <mn>0</mn>
  • </mrow>
  • </math>
  • </body>
  • </html>

    • 这会生成如下结果


    复制代码代码如下:x 2 + 4 x + 4 = 0
    便于学习这一概念 - 请使用 FireFox 3.7 或更高版本进行在线练习。

    矩阵表达示例
    想象一下下面的例子，它会被用来表示一个简单的 2x2 矩阵：

    XML/HTML Code复制内容到剪贴板
  • html
  • <!doctypehtml>
  • <html>
  • <head>
  • <metacharset="UTF-8">
  • <title>MathMLExamples</title>
  • </head>
  • <body>
  • <mathxmlns="http://www.w3.org/1998/Math/MathML">
  • <mrow>
  • <mi>A</mi>
  • <mo>=</mo>
  • <mfencedopen="["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>
  • </mrow>
  • </math>
  • </body>
  • </html>

    • 这会生成如下结果

    声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

    相关文章