$HTML5 MathML$

HTML5 MathML

概要

HTML5ではドキュメント内でMathML要素を使用できます。対応するタグは<math>...</math>です。

MathMLは数学標記言語で、XML（標準通用標記言語のサブセット）に基づく標準です。インターネット上で数学記号や数式を記述するための標記言語です。

注意事項

現在、MathMLタグをサポートしているのはFirefoxまたはSafariブラウザのみです。大部分のブラウザはまだMathMLタグをサポートしていませんので、あなたのブラウザがこのタグをサポートしていない場合、最新バージョンのFirefoxやSafariブラウザでご覧ください。

また、第三者のスタイルライブラリを使用して数学標記をサポートすることも可能です。

MathMLの例

基本的な例

以下はシンプルなMathMLの例です：

  <!DOCTYPE html>
  <html>
     <head>
        <meta charset="UTF-8">
        <title>サンプル</title>
     </head>
     <body>
        <math xmlns="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>

第三者ライブラリを使用した例

以下は第三者ライブラリを使用して数学標記をサポートする例です：

  <!DOCTYPE html>
  <html>
     <head>
        <meta charset="UTF-8">
        <title>サンプル</title>
        <script type="text/javascript" src="https://static.jyshare.com/assets/js/mathml/mspace.js"></script>
     </head>
     <body>
        <math xmlns="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>

演算子を追加した例

以下の例では、いくつかの演算子も追加されています：

  <!DOCTYPE html>
  <html>
     <head>
        <meta charset="UTF-8">
        <title>サンプル</title>
     </head>
     <body>
        <math xmlns="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>

第三者ライブラリを使用:

<!DOCTYPE html>
  <html>
     <head>
        <meta charset="UTF-8">
        <title>サンプル</title>
        <script type="text/javascript" src="https://static.jyshare.com/assets/js/mathml/mspace.js"></script>
     </head>
     <body>
        <math xmlns="http://www.w3.org/1998/Math/MathML">
           <mrow>
              <mrow>
                 <msup><mi>x</mi><mn>2</mn></msup>
                 <mo>+</mo>
                 <mn>4</mn>
                 <mi>x</mi>
              </mrow>
              <mo>+</mo>
              <mn>4</mn>
              </mrow>
              <mo>=</mo>
              <mn>0</mn>
           </mrow>
        </math>
     </body>
  </html>

2×2の行列の例

以下は2×2の行列の例です。この例はFirefox 3.5以上のバージョンで見ることができます：

  <!DOCTYPE html>
  <html>
     <head>
        <meta charset="UTF-8">
        <title>サンプル</title>
     </head>
     <body>
        <math xmlns="http://www.w3.org/1998/Math/MathML">
           <mrow>
              <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>
           </mrow>
        </math>
     </body>
  </html>

第三者ライブラリを使用:

  <!DOCTYPE html>
  <html>
     <head>
        <meta charset="UTF-8">
        <title>サンプル</title>
        <script type="text/javascript" src="https://static.jyshare.com/assets/js/mathml/mspace.js"></script>
     </head>
     <body>
        <math xmlns="http://www.w3.org/1998/Math/MathML">
           <mrow>
              <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>
           </mrow>
        </math>
     </body>
  </html>

Q＆A

Q: MathMLとは何ですか？

A: MathMLはXMLに基づく数学標記言語で、インターネット上で数学記号や数式を記述するために使用されます。

Q: MathMLをサポートしているブラウザは何ですか？

A: MathMLをサポートしているのは現在、FirefoxとSafariのみです。他のブラウザではまだ対応していません。

Q: MathMLを使用する際の注意点は何ですか？

A: 使用するブラウザがMathMLをサポートしていることを確認してください。サポートしていない場合は、最新のFirefoxかSafariを使用してください。第三者のスタイルライブラリを使用してサポートを追加することも可能です。