そろそろ MathML について本気で勉強するべきではないか

私達の身の回りは数式で溢れています。 そうであるならば, もはや強力なインフラの一つとなったウェブでも数式が表示できるようになってしかるべしです。 さあどうやって扱いましょう。

そうですね, **MathJax か KaTeX ですね**。

数式を扱うなら TeX の記法は知名度という点で強力ですし, えーマジ TeX きもーいな現代人の皆様も増えてきたとはいえ, たとえば Word の数式エディタなんかの書き方は TeX からかなり影響を受けていますので, 老いてなお健やかって感じです。

じゃあ MathML を学ぶ動機ってなくない? Chrome もあぐらかいてるしさぁ。

いちおう, MathML の優位性ってあります。 いちおうね。

目下としては **EPUB** が挙げられるでしょう。 EPUB の中身は HTML ですので, HTML に埋め込める数式特化な XML である MathML の優位性は MathJax らの比ではありません[^render_by_mathjax]。 SVG 画像? うんち。

[^render_by_mathjax]: あ, でもレンダラーとしてビュワー内部で使うのはアリ寄りのアリでしょう。

最も「公式」に近い EPUB リーダー Redium はもちろん, Kobo のような企業製のリーダーも対応してますし, さらには一般的知名度としておそらくぶっちぎりである~~殿様商売野郎~~ **Amazon Kindle** でさえ, [着々と MathML への対応を進めています](https://qiita.com/HigashinoSola/items/303bc83ed855f4ce4769)。 ~~同じ殿様商売の Google とはえらい違いだぁ。 とはいえ [Chrome もフラグを有効にするとクソザコナメクジとはいえ MathML を少しずつ表示できるようになってきています](https://momdo.hatenablog.jp/entry/20200706/1594040656)のでこっちも意外と健闘してます。~~ 遅咲きではありますし, 決して満開にはならないでしょうけど, それでも MathML の春は確実に来ます。

MathML の使い所さんはわかるけど, でも MathML って手打ちするもんじゃないから別に勉強しなくてよくないかという意見もあるでしょう。 たしかに一から十まで MathML を手書きはしないでしょうけど, HTML がそうであるように, 機械で生成したものを手で調整することはなかなか避けられないんじゃないかと思います。

たとえば, 先程挙げたとおり TeX にはあまりの強力さがあるので TeX から MathML へ変換するツールって需要がめちゃめちゃ高くてあちこちに落ちてますが, 結局のところ TeX は組版ソフトなので, 見た目に関係ない部分はかなりオミットされています。

例を挙げましょう。 TeX において以下の二つの式は等価です。

```tex
\[
x(x + 1)
\]

\[
f(x + 1)
\]
```

```math
x(x + 1)
```

```math
f(x + 1)
```

しかし, 上は $x$ と $x + 1$ の積であるのに対し, 下は $x + 1$ を関数 $f$ に適用しているのです。 MathML ではこれらを区別できます。 しかし自動化ツールではおそらく同じ出力になってしまうでしょう。

あなたのコンテンツに「正しい MathML」を掲げるためには, 結局 MathML の知識は必要不可欠と言えます。 ということで, この記事で MathML について簡単に学びましょう。

ただし, ここでは MathML そのものの話のみをし, それを HTML に組み込むための名前空間の宣言とか item プロパティへの云々に関しては省略します。 また, 本稿では表現 MathML のみを扱い, 内容 MathML については扱いません。

それと, この記事ではレンダリング結果も同時に示しますが, これは Qiita の機能を使用したものであるため, あくまで MathJax を用いて TeX 記法からレンダリングしたものです。 要するに「画像はイメージです」。 [こちらのサイト](https://www.tutorialspoint.com/online_mathml_editor.php)などで実際に MathML からレンダリングして確認することができます。 レンダリングには MathJax が使用されますので, Chrome などでも確認できます。 そう, MathJax は MathML もレンダリングできるんですよ! 誰も使わねえけどな!

```math
\def\Paren#1{\left({#1}\right)}
\def\Bracket#1{\left[{#1}\right]}
\def\Brace#1{\left\{{#1}\right\}}
\def\Norm#1{\left\|{#1}\right\|}
\def\Bra#1{\left\langle{#1}\right|}
\def\Ket#1{\left|{#1}\right\rangle}
```

## トークンとレイアウトスキーマ

MathML の構成最小要素を**トークン**とよびます。 トークンの中にはテキストが置かれます。

一方で, MathML を構成する要素の大半は**レイアウトスキーマ**です。 レイアウトスキーマの中には MathML の要素が置かれます。 これら子要素をしばしば**引数**といいます。

```html
<math display="block"> <!-- トップレベル要素 -->
  <mrow> <!-- 可変長引数のレイアウトスキーマ -->
    <mfrac> <!-- 2引数のレイアウトスキーマ -->
      <mn>1</mn> <!-- トークン -->
      <mi>x</mi> <!-- トークン -->
    </mfrac>
  </mrow>
</math>
```

```math
\frac{1}{x}
```

## 基本の 3 トークン, `mn`, `mi`, `mo`

では最初にトークンを学びます。 基本的なトークンは`mn`, `mi`, `mo`, の 3 個です。

`mn`の`n`は Number であり, そのまま**数字**を意味します。 小数を入れることはできますが, 分数は`/`で区切ってもだめです。

`mi`の`i`は Identifier であり, **識別子**です。 たとえば変数や定数, 未知数などを意味する文字や, 特定の関数の名前などがこれになります。 `<mi>x</mi>`のようにするとイタリックになりますが, これは一文字の識別子がデフォルトでイタリックになるというだけであり, **別に Italic の`i`ではない**ので注意が必要です。 たとえば, `<mi>sin</mi>`は期待通り立体になります。

`mo`の`o`は Operator であり, **演算子**です。 数字でも識別子でもないものは基本的に演算子だと思っておいてください。 特殊な例として, 括弧も MathML にとっては演算子です。 文字の上につくハットやドットのようなアクセントも演算子です。

トークンは, あくまでも一つのものが一つの要素となります。 **俺氏日本語下手すぎて笑う**。 たとえば, TeX ではふたつの変数の積`$ab$`と 2 桁の数字`$12$`は区別されません。 しかし, MathML では前者は`<mi>a</mi><mo>&it;</mo><mi>b</mi>`となり, 後者は`<mn>12</mn>`です。 そのため正弦関数も TeX では $\mathrm{s}$ と $\mathrm{i}$ と $\mathrm{n}$ の積とみなされないように`\text`で囲むのに対し[^sin], MathML では先述したように`<mi>sin</mi>`とすればいいだけで, 「テキスト」のトークンである`mtext`要素は使いません。

[^sin]: まあこの例の場合は`\sin`を使うのが正道でしょうけど。

### スタイル

上でデフォルトでイタリックになる云々と述べましたが, もちろん書体を変更することもできます。トークンの`mathvariant`属性の値として`normal`, `italic`, `fraktur`, `script`, `double-struck`などを指定します。 それぞれ, 立体, イタリック体, 亀の子文字, スクリプト体, 黒板太字の意味です。

```html
<math display="block">
  <mi mathvariant="normal">R</mi>
  <mo>,</mo>
  <mi mathvariant="italic">R</mi>
  <mo>,</mo>
  <mi mathvariant="fraktur">R</mi>
  <mo>,</mo>
  <mi mathvariant="script">R</mi>
  <mo>,</mo>
  <mi mathvariant="double-struck">R</mi>
</math>
```

```math
\mathrm{R}, R, \mathfrak{R}, \mathscr{R}, \mathbb{R}
```

なお, スクリプト体は $\mathcal{R}$ のようなブラシ体と $\mathscr{R}$ のようなカリグラフィーペン体を区別しない点は注意。

これらの値に`bold-`をつけると太字になります。 ただし太字立体は`bold-normal`ではなく単なる`bold`です。 また, 黒板太字はそもそも太字の筆記代用表記[^brack_board_bold]なので太字はありません。

[^brack_board_bold]: そのため活字で使うべきではないという意見もあります。 とはいえ, 数の集合は黒板太字を使うのが一般的ではありますが……。

ちなみに, Unicode においては「数式を言語としてみた場合, 異書体字はただ形が違うという以上の意味をもつ独立した文字だ」として, [数学用にイタリックなどの書体違いを用意しています](http://www.asahi-net.or.jp/~ax2s-kmtn/ref/unicode/u1d400.html)。 [𝑰𝑵𝑻𝑬𝑹𝑵𝑬𝑻お嬢様](https://shindanmaker.com/926762)みたいな使い方するもんじゃねんじゃ。 そのため, 以下のようにしても同じ結果が得られます。 ただし, 1 文字の立体のみ, 利便性を重視して強制的にイタリックにされますのでそこだけは属性での指定が必要です。

```html
<math display="block">
  <mi mathvariant="normal">R</mi>
  <mo>,</mo>
  <mi>𝑅</mi>
  <mo>,</mo>
  <mi>ℜ</mi>
  <mo>,</mo>
  <mi>ℛ</mi>
  <mo>,</mo>
  <mi>ℝ</mi>
</math>
```

### よく使われる演算子

次の説明に行く前に, 使用頻度が高い演算子について書いておきます。 極端な話, `mo`で囲んでしまえば Unicode 文字はなんでも演算子になってしまうので全部を網羅するのは事実上不可能なのですが, かといってなにも挙げないのもどうかという話ですので。

まずは四則演算。`+`は $+$ を, `-`は $-$ を指します。 ハイフンマイナスはマイナスとは別の記号なのですが, ちゃんと便宜を図ってくれます[^hyphen_minus]。 ここは TeX と同様ですね。 乗法と除法は数値参照か実体参照を使い, `&times;`で $\times$, `&div;`で $\div$ のようにするのが一般的でしょうが, よく考えるとこいつら要するに XML の仕様を使って Unicode 文字を参照してるだけなので, ASCII 文書でもなければ直接これらの文字を入れるのもありです。

[^hyphen_minus]: ただし, これは処理系依存とされています。

関係演算子に関しても同様に, `=`で $=$ と簡単に打てるやつは直接入れて, `&le;`で $\le$ のようにちょっと打ちづらいのは参照を使いましょう。 「メリケンのキーボードは軟弱だな!」とか言いながら IME を駆使して`≤`するのも当然 OK です。

可読性という観点からこの記事では直接入れる方向性で行こうと思います。 ~~ただでさえ MathML 可読性低いし。~~ しかし, 可読性という観点だからこそ参照を使わざるを得ない演算子もあります。 それが「**不可視の演算子**」です。

もっとも多く使われるのは「**不可視の積**」`&InvisibleTimes;`です。 `&it;`という略称もあります。 あまり意識されませんが, こいつは $2x$ の $2$ と $x$ の間にいます。

その次に多く使われるのが「**関数適用**」`&ApplyFunction;`です。 `&af;`という略称もあります。 やっぱりあまり意識されませんが, こいつは $\sin x$ の $\sin$ と $x$ の間にいます。 Haskell には`$`という関数適用演算子がありますね。

確実にこいつらよりは使用頻度が劣りますが, たまーに出てくるものに「不可視の区切り」`&InvisibleComma;`があります。`&ic;`という略称もあります。 どこで出てくるのかというと, $a_{ij}$ の $i$ と $j$ の間にいます。 これ, おそらく数列 $a$ の $i \times j$ 番目ではなく, 行列 $A$ の第 $i$ 行第 $j$ 列要素ですよね。 そういうことです。 $a_{i, j}$ のカンマが省略されていると考えるのです。

……こいつの説明いる? まず使われません,「不可視の和」`&#x2064;`。 使われなさすぎてどうも実体参照が用意されてないようです。 どこで出てくるのかって? 思い出してください, **クソ忌々しい帯分数**のことを。 はい, $9 \frac{3}{4}$ の $9$ と $\frac{3}{4}$ の間にいます。 滅べ。

より多くの情報を得る手段については, あくまでも「仕様」ではないが有用な資料として, [W3C による演算子辞書の提案](http://takamu.sakura.ne.jp/mathml3-ja/appendixc-ja.html)をおすすめします。

## 部分式 - `mrow`

ここからはレイアウトスキーマを挙げていきます。 最初に上げるのは**部分式**を示す`mrow`要素です。 可変長引数です。

こいつは以下で挙げていく連中のような特殊な意味を特に持ちません。 複数の要素をひとつにまとめるのが役目であり, ひとまとまりであるということそのものが唯一の意味と言えるでしょう。 HTML でいうと`span`要素みたいなものですね。

使い所さんとして, ちょっと早いですが 2 引数のレイアウトスキーマの代表として`mfrac`を挙げましょう。 こいつは 2 引数なので長い式が出てくる場合はそれを`mrow`でくくります。

```html
<math display="block">
  <mfrac>
    <mn>1</mn> <!-- 第一引数 -->
    <mrow> <!-- 第二引数 -->
      <mi>x</mi>
      <mo>+</mo>
      <mn>1</mn>
    </mrow> <!-- 第二引数ここまで -->
  </mfrac>
</math>
```

```math
\frac{1}{x + 1}
```

また, 1 引数のレイアウトスキーマに複数の要素が入っているときなどは, それらすべてが`mrow`で囲まれているものと解釈されます。 これを推測された`mrow`といいます。

`mrow`そのものには大きな意味はありませんが, 一塊であることというのはレンダリングに大きな意味をおよぼします。

たとえば, 括弧はストレッチ(伸縮可能)な特性を持つ演算子のため, このように組むと自動で伸びます。

```html
<math display="block">
  <mo>(</mo>
  <mfrac>
    <mn>1</mn>
    <mi>x</mi>
  </mfrac>
  <mo>+</mo>
  <mn>1</mn>
  <mo>)</mo>
</math>
```

```math
\Paren{\frac{1}{x} + 1}
```

しかし, 以下のようにすると, 右側まで伸びてしまいます。

```html
<math display="block">
  <mo>(</mo>
  <mfrac>
    <mn>1</mn>
    <mi>x</mi>
  </mfrac>
  <mo>+</mo>
  <mn>1</mn>
  <mo>)</mo>
  <mo>(</mo>
  <mi>x</mi>
  <mo>-</mo>
  <mn>1</mn>
  <mo>)</mo>
</math>
```

```math
\biggl(\frac{1}{x} + 1\biggr)\biggl(x - 1\biggr)
```

これは, 演算子としての括弧は内側を囲っているとは考えておらず, かわりに「自分を囲む一番内側の一塊」の中で最も大きなものに合わせるようストレッチするからです。 そして, 今回の場合`math`の内側すべてが推測された`mrow`で囲われているため, 後ろの括弧も $\frac{1}{x}$ に合わせた長さになっているのです。

これを回避するためには, それぞれの括弧を`mrow`で囲います。

```html
<math display="block">
  <mrow>
    <mo>(</mo>
    <mfrac>
      <mn>1</mn>
      <mi>x</mi>
    </mfrac>
    <mo>+</mo>
    <mn>1</mn>
    <mo>)</mo>
  </mrow>
  <mrow>
    <mo>(</mo>
    <mi>x</mi>
    <mo>-</mo>
    <mn>1</mn>
    <mo>)</mo>
  </mrow>
</math>
```

```math
\Paren{\frac{1}{x} + 1}\Paren{x - 1}
```

## 括弧 - `mfenced`

上で括弧は内側を囲っているとはみなさない, という話をしました。 しかし, そもそもマークアップとは範囲を示すという意味があるので, **括弧**を要素にしてしまうのはいいアイデアです。 そのために`mfenced`要素があります。 可変長引数です。

たとえば, 三次元座標などは以下のように組めます。

```html
<math display="block">
  <mfenced>
    <mn>0</mn>
    <mn>1</mn>
    <mn>2</mn>
  </mfenced>
</math>
```

```math
\Paren{0, 1, 2}
```

見てのとおり, 複数の引数を与えるとそれらがカンマで区切られます。 なので, ひとつの式を括弧で囲むだけならその全体を`mrow`で囲むのがいいでしょう。

```html
<math display="block">
  <mfenced>
    <mrow>
      <mi>x</mi>
      <mo>+</mo>
      <mn>1</mn>
    </mrow>
  </mfenced>
</math>
```

```math
\Paren{x + 1}
```

括弧の種類を変えるには`open`属性と`close`属性が使えます。 また, 区切り記号を変えるには`separators`属性が使えます。 以下にノルム, 集合の外延的記法, 半開区間, 量子状態のブラケット記法の使用例を示します。

```html
<math display="block">
  <mfenced open="‖" close="‖">
    <mi>𝐯</mi>
  </mfenced>
</math>
```

```math
\Norm{\mathbf{v}}
```

```html
<math display="block">
  <mfenced open="{" close="}">
    <mn>1</mn>
    <mn>4</mn>
    <mn>9</mn>
    <mn>16</mn>
    <mi>…</mi>
  </mfenced>
</math>
```

```math
\Brace{1, 4, 9, 16, \ldots}
```

```html
<math display="block">
  <mfenced open="[">
    <mn>0</mn>
    <mi>∞</mi>
  </mfenced>
</math>
```

```math
\left[0, \infty\right)
```

```html
<math display="block">
  <mfenced open="⟨" close="⟩" separators="|">
    <mi>ψ</mi>
    <mi>H</mi>
    <mi>φ</mi>
  </mfenced>
</math>
```

```math
\Bra{\psi}H\Ket{\varphi}
```

## 分数 - `mfrac`

すでに何度も使ってましたが, **分数**の要素として`mfrac`が用意されています。 2 引数で, 第一引数が分子, 第二引数が分母です。

```html
<math display="block">
  <mfrac>
    <mi>x</mi>
    <mrow>
      <mi>x</mi>
      <mo>+</mo>
      <mn>1</mn>
    </mrow>
  </mfrac>
</math>
```

```math
\frac{x}{x + 1}
```

## 平方根 - `msqrt`

**平方根**の要素として`msqrt`が用意されています。 1 引数です。

```html
<math display="block">
  <mi>i</mi>
  <mo>:=</mo>
  <msqrt>
    <mo>-</mo>
    <mn>1</mn>
  </msqrt>
</math>
```

```math
i := \sqrt{-1}
```

## 冪根 - `mroot`

より汎用的な**冪根**の要素として`mroot`が用意されています。 2 引数で, 第一引数が被開法数, 第二引数が指数です。

```html
<math display="block">
  <mroot>
    <mn>27</mn>
    <mn>3</mn>
  </mroot>
  <mo>=</mo>
  <mn>3</mn>
</math>
```

```math
\sqrt[3]{27} = 3
```

## 添字 - `msup`, `msub`, `msubsup`, `mover`, `munder`, `munderover`

**添字**の要素として, 上付きに`msup`, 下付きに`msub`が用意されています。 2 引数で, 第一引数が本体, 第二引数が添え字です。

```html
<math display="block">
  <msub>
    <mi>a</mi>
    <mi>i</mi>
  </msub>
  <mo>:=</mo>
  <msup>
    <mn>2</mn>
    <mrow>
      <msub>
        <mi>a</mi>
        <mrow>
          <mi>i</mi>
          <mo>-</mo>
          <mn>1</mn>
        </mrow>
      </msub>
    </mrow>
  </msup>
</math>
```

```math
a_i := 2^{a_{i - 1}}
```

両方の添字を同時に付ける場合は`msubsup`が用意されています。 3 引数で, 第一引数が本体, 第二引数が下付き添字, 第三引数が上付き添字です。

```html
<math display="block">
  <msubsup>
    <mi>a</mi>
    <mrow>
      <mi>i</mi>
      <mo>+</mo>
      <mn>1</mn>
    </mrow>
    <mn>2</mn>
  </msubsup>
</math>
```

```math
a_{i + 1}^2
```

右上, 右下ではなく, 真上, 真下への添字として`mover`, `munder`, `munderover`が用意されています。 使い方は同様です。

```html
<math display="block">
  <munder>
    <mi>lim</mi>
    <mrow>
      <mi>x</mi>
      <mo>→</mo>
      <mi>∞</mi>
    </mrow>
  </munder>
  <mo>&af;</mo>
  <mfrac>
    <mn>1</mn>
    <mi>x</mi>
  </mfrac>
  <mo>=</mo>
  <mn>0</mn>
</math>
```

```math
\lim_{x \to \infty} \frac{1}{x} = 0
```

なお, アクセント類もこれによってつけます。 たとえば, ハットや 2 点間ベクトルは以下のように組めます。 一部の演算子はストレッチします。 なおアクセント用として定義されていない演算子をアクセントとして用いる場合, 演算子自身の`accent`属性を`true`にします[^under_over_accent]。

[^under_over_accent]: `mover`および`munder`の属性を変更する方法もありますが, この場合要素によって属性名が違うので演算子の属性を変えるほうが覚えやすいでしょう。

```html
<math display="block">
  <mover>
    <mi>𝐱</mi>
    <mo>^</mo>
  </mover>
  <mo>:=</mo>
  <mover>
    <mi>AB</mi>
    <mo>→</mo>
  </mover>
</math>
```

```math
\hat{\mathbf{x}} := \overrightarrow{\mathrm{AB}}
```

バーも同様です。

```html
<math display="block">
  <mover>
    <mrow>
      <mi>a</mi>
      <mo>+</mo>
      <mi>b</mi>
      <mo>&it;</mo>
      <mi>i</mi>
    </mrow>
    <mo>_</mo>
  </mover>
  <mo>=</mo>
  <mrow>
    <mi>a</mi>
    <mo>-</mo>
    <mi>b</mi>
    <mo>&it;</mo>
    <mi>i</mi>
  </mrow>
</math>
```

```math
\overline{a + bi} = a - bi
```

アクセントに類する話として, プライム, あるいは慣例的にダッシュと呼ばれるものは, MathML では直接並べるのではなく添字として扱うことになっています。プライムや度記号などは疑似添字として定義されていて, 添字にしてもサイズが変わりません。

```html
<math display="block">
  <msup>
    <mi>f</mi>
    <mo>'</mo>
  </msup>
  <mo>:=</mo>
  <mfrac>
    <mrow>
      <mo lspace="verythinmathspace" rspace="0">d</mo>
      <mi>f</mi>
    </mrow>
    <mrow>
      <mo lspace="verythinmathspace" rspace="0">d</mo>
      <mi>x</mi>
    </mrow>
  </mfrac>
</math>
```

```math
f' = \frac{df}{dx}
```

## ファントム - `mphantom`

数学的な要素とは言いがたいですが, **ファントム**のために`mphantom`要素が用意されています。 1 引数です。

ファントムは引数ぶんのスペースを確保します。 使い道としては後に説明する表様組みと組み合わせて,  等号揃えをサボったりできます[^phantom]。 楽なだけでなく表様組みのみ使うよりも可読性も上がりますので個人的には結構おすすめです。

[^phantom]: 自分語りになりますが, ニコニコ大百科の「超実数」の記事を書いたときに似たような手口を使いました。

```html
<math display="block">
  <mtable columnalign="left">
    <mtr><mtd>
      <mi>a</mi>
      <mo>=</mo>
      <mi>b</mi>
    </mtd></mtr>
    <mtr><mtd>
      <mphantom><mi>a</mi></mphantom>
      <mo>=</mo>
      <mi>c</mi>
    </mtd></mtr>
    <mtr><mtd>
      <mphantom><mi>a</mi></mphantom>
      <mo>=</mo>
      <mi>d</mi>
    </mtd></mtr>
  </mtable>
</math>
```

```math
\begin{aligned}
a &= b \\
&= c \\
&= d
\end{aligned}
```

## 表様組み

**ベクトル**や**行列**, **複数段の数式**など, 表の形で組むのが有効な数式があります。 TeX でいうと`array`環境, `eqnarray`環境や`align`環境にあたります。

`mtable`, `mtr`, `mtd`によって組まれ, これらはほぼ HTML の`table`, `tr`, `td`と同様に利用できます。

```html
<math display="block">
  <mfenced>
    <mtable>
      <mtr>
        <mtd><mn>0</mn></mtd>
      </mtr>
      <mtr>
        <mtd><mn>1</mn></mtd>
      </mtr>
      <mtr>
        <mtd><mn>2</mn></mtd>
      </mtr>
    </mtable>
  </mfenced>
</math>
```

```math
\Paren{
  \begin{array}{c}
    0 \\
    1 \\
    2 \\
  \end{array}
}
```

```html
<math display="block">
  <mfenced>
    <mtable>
      <mtr>
        <mtd><mn>0</mn></mtd>
        <mtd><mn>1</mn></mtd>
        <mtd><mn>2</mn></mtd>
      </mtr>
    </mtable>
  </mfenced>
</math>
```

```math
\Paren{
  \begin{array}{ccc}
    0 & 1 & 2
  \end{array}
}
```

```html
<math display="block">
  <mi>E</mi>
  <mo>=</mo>
  <mfenced open="[" close="]">
    <mtable>
      <mtr>
        <mtd><mn>1</mn></mtd>
        <mtd><mn>0</mn></mtd>
        <mtd><mn>0</mn></mtd>
      </mtr>
      <mtr>
        <mtd><mn>0</mn></mtd>
        <mtd><mn>1</mn></mtd>
        <mtd><mn>0</mn></mtd>
      </mtr>
      <mtr>
        <mtd><mn>0</mn></mtd>
        <mtd><mn>0</mn></mtd>
        <mtd><mn>1</mn></mtd>
      </mtr>
    </mtable>
  </mfenced>
</math>
```

```math
E = \Bracket{
  \begin{array}{ccc}
    1 & 0 & 0 \\
    0 & 1 & 0 \\
    0 & 0 & 1
  \end{array}
}
```

```html
<math display="block">
  <mtable columnalign="left" columnspacing="thickmathspace">
    <mtr>
      <mtd>
        <msup>
          <mi>c</mi>
          <mn>2</mn>
        </msup>
      </mtd>
      <mtd>
        <mo>=</mo>
      </mtd>
      <mtd>
        <msup>
          <mfenced>
            <mrow>
              <mi>a</mi>
              <mo>+</mo>
              <mi>b</mi>
              <mo>&it;</mo>
              <mi>i</mi>
            </mrow>
          </mfenced>
          <mn>2</mn>
        </msup>
      </mtd>
    </mtr>
    <mtr>
      <mtd></mtd>
      <mtd>
        <mo>=</mo>
      </mtd>
      <mtd>
        <mfenced>
          <mrow>
            <mi>a</mi>
            <mo>+</mo>
            <mi>b</mi>
            <mo>&it;</mo>
            <mi>i</mi>
          </mrow>
        </mfenced>
        <mo>&it;</mo>
        <mfenced>
          <mrow>
            <mi>a</mi>
            <mo>+</mo>
            <mi>b</mi>
            <mo>&it;</mo>
            <mi>i</mi>
          </mrow>
        </mfenced>
      </mtd>
    </mtr>
    <mtr>
      <mtd></mtd>
      <mtd>
        <mo>=</mo>
      </mtd>
      <mtd>
        <msup>
          <mi>a</mi>
          <mn>2</mn>
        </msup>
        <mo>+</mo>
        <mn>2</mn>
        <mo>&it;</mo>
        <mi>a</mi>
        <mo>&it;</mo>
        <mi>b</mi>
        <mo>&it;</mo>
        <mi>i</mi>
        <mo>-</mo>
        <msup>
          <mi>b</mi>
          <mn>2</mn>
        </msup>
      </mtd>
    </mtr>
  </mtable>
</math>
```

```math
\begin{aligned}
  c^2 &= \Paren{a + bi}^2 \\
  &= \Paren{a + bi}\Paren{a + bi} \\
  &= a^2 + 2abi - b^2
\end{aligned}
```

```html
<math display="block">
  <msub>
    <mi>x</mi>
    <mi>i</mi>
  </msub>
  <mo>=</mo>
  <mfenced open="{" close="">
    <mtable columnalign="left">
      <mtr>
        <mtd><mi>∅</mi></mtd>
        <mtd>
          <mtext>(</mtext>
          <mi>i</mi>
          <mo>=</mo>
          <mn>0</mn>
          <mtext>)</mtext>
        </mtd>
      </mtr>
      <mtr>
        <mtd>
          <msub>
            <mi>x</mi>
            <mrow>
              <mi>i</mi>
              <mo>-</mo>
              <mn>1</mn>
            </mrow>
          </msub>
          <mo>∪</mo>
          <mfenced open="{" close="}">
            <msub>
              <mi>x</mi>
              <mrow>
                <mi>i</mi>
                <mo>-</mo>
                <mn>1</mn>
              </mrow>
            </msub>
          </mfenced>
        </mtd>
        <mtd><mtext>(otherwise)</mtext></mtd>
      </mtr>
    </mtable>
  </mfenced>
</math>
```

```math
x_i =
\begin{cases}
  \emptyset &\text{($i = 0$)} \\
  x_{i - 1} \cup \Brace{x_{i - 1}} & \text{(otherwise)}
\end{cases}
```

## さらにその先へ

とりあえずここまで挙げた分だけで大抵の数式は事足りると思います。

しかし, MathML の底力はこれだけではありません。 テンソルで使うような四隅の添字や, 筆算なども表現できます。

さらなる学習のためにはもちろん一次ソース, つまり仕様書をあたるのが一番ですが, より読みやすく, かつまとまった資料として, AH Formatter を販売しているアンテナハウスが作成した [MathML 組版入門](https://www.antenna.co.jp/AHF/ahf_publication/MathML/mathml-guide.pdf?bcsi_scan_70660f4bdc68c18f=0&bcsi_scan_filename=mathml-guide.pdf)もおすすめしておきます。 ただし, 現在は Deprecated となっている属性などの記述もあるので, [Mozilla のリファレンス](https://developer.mozilla.org/ja/docs/Web/MathML)と突き合わせながら読むことをおすすめします。