MathML: Mathematics in HML

MathML comprises two sets of elements: Presentation Markup, the XML equivalent of TeX math, and Content Markup, which may be used to encode the mathematical structure of an expression, regardless of the way this expression is rendered visually.

OpenMath is another XML-based language for mathematics that focuses on the semantics (not the presentation).

Equivalences between MathML and TeX/LaTex are explained elsewhere.

Including MathML Code

Write your MathML code between <math> and </math>. Use attibutes. Firefox Mozilla seems to understand:

<math xmlns="http://www.w3.org/1998/Math/MathML" display="inline|block">

(Remember to close the element with a </math> tag.

Presentation MathML

Basic Elements

MathML most basic elements are mrow, mi, mo and mn. Example: x + y = 2 is encoded in MathML as:

<math xmlns="http://www.w3.org/1998/Math/MathML" display="inline">
      <mrow>
        <mrow>
          <mi>x</mi>
          <mo>+</mo>
          <mi>y</mi>
        </mrow>
        <mo>=</mo>
        <mn>2</mn>
      </mrow>
</math>
math

top, all-enclosing element. (It may containt children)

mrow

Use this element to group any number of subexpressions horizontally. (It may containt children)

mi

Use this element to specify an identifier, that is, the name of a variable, a constant, a function, etc. If this name is just one character long, the identifier is automatically rendered using an italic font, otherwise the name is rendered using a normal, upright, font.

mo

Use this element to specify an operator (e.g. '+'), a fence (e.g. '{') or a separator (e.g. ','). The appropriate amount of space is added on the left and on the right of an mo depending on the textual contents of this element. Example: if in the above expression you replace <mo>+</mo> by <mo>,</mo>, this will suppress the space at the left of the mo element. (The mo element stretches vertically or horizontally when needed to. The amount of stretching is normally automatically determined by the MathML renderer, but it is possible to influence it by specifying the minsize and/or maxsize attributes. Example: →</mo>]]> means: make the arrow at least 10 times its normal size.)

mn

Use this element to specify a numeric literal.

mtext

Use this element to type plain text

Explicit space between elements

Leading and trailing whitespace characters are automatically removed from mi, mo, mn, and mtext by the MathML processor. Instead, you need to insert an mspace element in your MathML expression. Its attributes are:

width

(optional) overall width of the mspace element.

height

(optional) overall height above the baseline.

depth

(optional) overall height below the baseline.

The value of these attributes is a number followed by one of the following units: em, ex, px, in, cm, mm, pt, pc.

Fractions

Use mfrac holding two children: numerator and denominator, as in:

<mfrac>
      <mrow>
        <mi>x</mi>
        <mo>-</mo>
        <mn>1</mn>
      </mrow>
      <mn>100</mn>
</mfrac>

(Attribute bevelled="true" may be used to change the style of the fraction.)

Radicals

MathML has two elements allowing to specify radicals:

msqrt

Use this element to specify a square root.

mroot

Use this element to specify a radical with an arbitrary index. Unlike msqrt, mroot may only have two children: the base of the root and its index. If you need more that one element below the radical sign, then use an explicit mrow. Example:


      <mi>x</mi>
      <mn>3</mn>

Subscripts and superscripts

msub

Use this element to attach a subscript to a base.

msup

Use this element to attach a superscript to a base.

msubsup

Use this element to attach both a subscript and a superscript to a base. Example:

<msubsup>
      <mi>x</mi>
      <mi>i</mi>
      <mi>j</mi>
</msubsup>

(Note that for all the above elements, the base is the first child element.)

Underscripts and overscripts

Underscripts and overscripts are similar to subscripts and superscripts, except that script elements are centered above and/or below the base element.

munder

Use this element to attach a underscript to a base.

mover

Use this element to attach a overscript to a base.

munderover

Use this element to attach both a underscript and a overscript to a base.

Alignment (matrices and equations)

Matrices are specified using the mtable element which is similar to the simple — no tbody — XHTML table. An mtable table element contains mtr row elements and an mtr element contains mtd cell elements. Note that by default, an mtable element has no borders at all. This is why you'll generally need to add an mo containing a fence character (e.g. '[', ']', '(', ')', '|') before and after the mtable when you specify a matrix or the determinant of a matrix. Example:

<mrow>
      <mo>[</mo>
      <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>
      <mo>]</mo>
</mrow>

The MathML mtable element is fairly generic. Use it whenever you need to layout elements in a rectangular grid. This feature is of course useful to specify matrices. It is also useful to specify a set of equations.

Replacing an mtr row element by an mlabeledtr labeled row element allows to use the first mtd cell element of this row as the caption of the equation.

Other, less useful, elements

ms

Use this element to specify a quoted string literal. Example: <ms>Hello word!</ms>

mfenced

The mfenced element is a shorthand notation for common forms of mrow. The open, separators and close attributes of an mfenced element specify the opening fence added before its first child element, the separators added between child elements and the closing fence added after its last child element. By default, the values of these attributes are "(", "," and ")".For instance, to get (x, y, z) type:

<mfenced>
      <mi>x</mi>
      <mi>y</mi>
      <mi>z</mi>
</mfenced>
menclose

The menclose element allows to draw lines, typically a box, around its child elements. The notation attribute of an menclose element specify which kind of lines are drawn around the child elements. The allowed values for this attribute are: longdiv (default value), actuarial, radical, box, round- edbox, circle, left, right, top, bottom, updiagonalstrike, downdiagonalstrike, verticalstrike, horizontalstrike. Example:

<menclose notation="box">
      <mi>n</mi>
      <mo>!</mo>
</menclose>
mpadded

The mpadded element allows to add padding, that is extra space, around its child elements. It's an alternative to using mspace. The attributes allowing to specify the padding are:

  • width: This optional attribute specifies the overall width of the mpadded element. The value of this attribute, as well as the values of the height and depth attributes (but not the lspace attribute) described below, may start with a "+" sign which means: add specified amount to the intrinsic size.
  • lspace: This optional attribute specifies the amount of space added before the first child of the mpadded element. (There is no rspace attribute. The amount of space added after the last child of the mpadded element is: value of the above width attribute - intrinsic width of all the child elements - value of this lspace attribute.)
  • height: This optional attribute specifies the overall height above the baseline.
  • depth: This optional attribute specifies the overall height below the baseline.
mphantom

The mphantom element transforms its descendant elements into 'phantoms': they are there, they occupy some space, but you cannot see them. The mphantom element is often the only way to properly align some elements.

mstyle

The mstyle element allows to specify attributes which are intended to be inherited by all its descendant elements. As such, the mstyle element supports all the attributes of all the other MathML elements. The most commonly used attributes are those used to style the mi, mo, mn and mtext text container elements:

    mathvariant: normal | bold | italic | bold-italic | double-struck | bold-fraktur | script | bold-script | fraktur | sans-serif | bold-sans-serif | sans-serif-italic | sans-serif-bold- italic | monospace
    mathsize: small | normal | big | number v-unit
    mathcolor: #rgb | #rrggbb | html-color-name
    mathbackground: #rgb | #rrggbb | html-color-name
maligngroup

Use this element to properly align a set of equations. Each inserted maligngroup specifies a sub-column within the column of an mtable. The groupalign attribute of the mtable element specifies the horizontal alignment within each sub-column. The value of the groupalign attribute has the following syntax: one {...} group per column. A {...} group contains one alignment specification per sub-column (that is, per maligngroup). Alignment specifications are: left, center or right.

Examples of Presentation MathML*

Mathematics style attributes common to token elements

MathML 2.0 introduces four new mathematics style attributes. These attributes are valid on all presentation token elements except mspace and mglyph, and on no other elements except mstyle. The attributes are:

Styles Table

mathvariant: normal | bold | italic | bold-italic | double-struck | bold-fraktur | script | bold-script | fraktur | sans-serif | bold-sans-serif | sans-serif-italic | sans-serif-bold-italic | monospace (default is normal except on <mi>)
mathsize: small | normal | big | number v-unit (default=inherited)
mathcolor: #rgb | #rrggbb | html-color-name (default=inherited)
mathbackground: #rgb | #rrggbb | html-color-name (default=inherited)

Space (mspace)

Space(s)

width: number h-unit | namedspace (default=0em)
height: number v-unit (default=0em)
depth: number v-unit (default=0em)
linebreak: auto | newline | indentingnewline | nobreak | goodbreak | badbreak (default=auto)

The linebreak attribute is used to give a linebreaking hint to a visual renderer. The default value is <auto>, which indicates that a renderer should use whatever default linebreaking algorithm it would normally use. The meanings of the other values are described in the table below:

Linebreak(s)

newline: start a new line and do not indent
indentingnewline: start a new line and do indent
nobreak: do not allow a linebreak here
goodbreak: if a linebreak is needed on the line, here is a good spot
badbreak: if a linebreak is needed on the line, try to avoid breaking here