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
<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 eachsub-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:
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)
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:
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 |