Once all basic math notations are known, it remains to consider tabular layout which can be used for matrix-like expressions and other advanced math layout.
|Prerequisites:||Basic computer literacy, basic software installed, basic knowledge of working with files, and HTML basics (study Introduction to HTML. and HTML tables)|
|Objective:||To get familiar with MathML tabular elements and be aware of some use cases.|
MathML tabular elements
The MathML tabular elements are similar to the ones for HTML tables: the
<mtable> element represents a mathematical table, it has
<mtr> elements as its children (representing rows), each of them having
<mtd> elements as its children (representing cells). An
<mtable> element can be inserted anywhere in a MathML formula. The
<mtd> element can contain any number of MathML children and will lay them out as an
Tables are typically used for matrix-like expressions (including vectors). Here is a basic example taken from the article about the CSS
<math display="block"> <mrow> <mo>(</mo> <mtable> <mtr> <mtd> <mi>a</mi> </mtd> <mtd> <mi>c</mi> </mtd> <mtd> <mn>0</mn> </mtd> <mtd> <msub> <mi>t</mi> <mi>x</mi> </msub> </mtd> </mtr> <mtr> <mtd> <mi>b</mi> </mtd> <mtd> <mi>d</mi> </mtd> <mtd> <mn>0</mn> </mtd> <mtd> <msub> <mi>t</mi> <mi>y</mi> </msub> </mtd> </mtr> <mtr> <mtd> <mn>0</mn> </mtd> <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>0</mn> </mtd> <mtd> <mn>1</mn> </mtd> </mtr> </mtable> <mo>)</mo> </mrow> </math>
Allowing cells to span multiple rows and columns
This is again similar to HTML tables. The
<mtd> element accepts the
rowspan attributes to indicate that the cell spans multiples rows and columns. Below the inner matrix spans two columns of the outer matrix:
Note: For historical reason, the MathML attribute for column spanning is called
Usage for advanced layout
Besides representing matrix-like objects, MathML tables are sometimes used for advanced layout inside mathematical formulas, for example in Wikipedia's definition of Legendre symbol. Here, the different cases are written on three different rows while the values and conditions are placed on two different columns.
<mtable> article provides more advanced layout options via special attributes such as alignment or spacing. These originated before CSS equivalents and were originally designed and intended for renderers which were not-CSS aware. However, these attributes may not be implemented in all browsers. In the future, it is likely that usages of
<mtable> for layout-only purpose (i.e. not actual matrix-like objects) can be replaced with CSS-based alternatives.
In this article, we've reviewed the
<mtd> elements which are the equivalent of HTML elements for tables. We have seen how to use them for representing matrix-like objects and how it is sometimes used for advanced layout.
You've nearly finished this module — we only have one more thing to do. In the three famous mathematical formulas assessment you'll use your new knowledge to rewrite a small mathematical article using HTML and MathML.