MathML - Quick Guide

MathML stands for Mathematical Markup Language and is an XML based application. It is used to describe mathematical and scientific notations. It's 1 and 2 version were created and developed by The Math Working Group which is one of the oldest W3C Working Groups during 1996-2004. MathML version 3 was created during Math Working Group's second activity period (2006-2016)and is an ISO standard.
MathML is XML based and have limited number of tags which can be used to mark up a mathematical equation in terms of format and its semantics. MathML intends to capture meaning of syntax as well as formatting of the equation. Considering the fact the mathematical equations are often meaningful to many applications so writing them using MathML handles formatting as well as meaning of an equation. MathML provides low-level format to describing mathematics as a basis taken for machine to machine communication.
Various applications like algebra systems, print typesetters can use MathML to encode mathematical notation for high-quality visual display, and mathematical content and scientific software, voice synthesizers can use MathML for semantics.
MathML provides two ways to represent a mathematical notation.
Presentational Way − It uses mark up tags like mrow, mi, mo along with mathematical operators etc.
Presentational Way − It uses mark up tags like mrow, mi, mo along with mathematical operators etc.
Semantic Way − It uses mark up tags like apply, eq, power etc.
Semantic Way − It uses mark up tags like apply, eq, power etc.
We are using MathJax library to render MathML syntax so that it can run on all major browsers. It currently supports presentational way only.
<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>
<maction> − Provides option to bind actions to subexpressions/expressions.
<maction> − Provides option to bind actions to subexpressions/expressions.
<math> − It is top or root level element and is used to encapsulate each instance of MathML instance. Every valid MathML expression should be wrapped in outer <math> tag. It can contain any number of child elements. One math element cannot contain another math element tag.
<math> − It is top or root level element and is used to encapsulate each instance of MathML instance. Every valid MathML expression should be wrapped in outer <math> tag. It can contain any number of child elements. One math element cannot contain another math element tag.
<menclose> − Renders its content inside an enclosing notation specified by the notation attribute.
<menclose> − Renders its content inside an enclosing notation specified by the notation attribute.
<merror> − Used to display contents as error message.
<merror> − Used to display contents as error message.
<mfenced> − Provides the option to add custom opening and closing parentheses and separators to an expression.
<mfenced> − Provides the option to add custom opening and closing parentheses and separators to an expression.
<mfrac> − Used to display fractions.
<mfrac> − Used to display fractions.
<mglyph> − Used to display non-standard symbols where existing Unicode characters are not available.
<mglyph> − Used to display non-standard symbols where existing Unicode characters are not available.
<mi> − Used to specify an identifier such as name of a variable, function or a constant etc. For example, <mi>PI</mi> .
<mi> − Used to specify an identifier such as name of a variable, function or a constant etc. For example, <mi>PI</mi> .
<mlabeledtr> − Used to represent a label in a row either on the left or on the right side  using side attribute of mtable. Child elements of mlabeledtr must be mtd elements.
<mlabeledtr> − Used to represent a label in a row either on the left or on the right side  using side attribute of mtable. Child elements of mlabeledtr must be mtd elements.
<mmultiscripts> − Provides options to create tensor-like objects.
<mmultiscripts> − Provides options to create tensor-like objects.
<mn> − Used to specify a numerical literal like 3.14 etc. For example, <mn>3.14</mn>.
<mn> − Used to specify a numerical literal like 3.14 etc. For example, <mn>3.14</mn>.
<mo> − Used to specify an operator like +, - etc. For example, <mo>+</mo>.
<mo> − Used to specify an operator like +, - etc. For example, <mo>+</mo>.
<mover> − Used to attach an accent or a limit over an expression.
<mover> − Used to attach an accent or a limit over an expression.
<mpadded> − Used to add extra padding and to set the general adjustment of position and size of enclosed contents.
<mpadded> − Used to add extra padding and to set the general adjustment of position and size of enclosed contents.
<mphantom> − Used to create space as it is rendered invisibly, keeping height, width, and baseline position intact.
<mphantom> − Used to create space as it is rendered invisibly, keeping height, width, and baseline position intact.
<mroot> − Used to display roots with an explicit index.
<mroot> − Used to display roots with an explicit index.
<mrow> − Used to group any number of sub expressions in horizontal way.
<mrow> − Used to group any number of sub expressions in horizontal way.
<ms> − Used to represent a string literal meant to be interpreted by programming languages and computer algebra systems.
<ms> − Used to represent a string literal meant to be interpreted by programming languages and computer algebra systems.
<mspace> − Used to display a blank space, where its size is set using its attributes.
<mspace> − Used to display a blank space, where its size is set using its attributes.
<msqrt> − Used to display square root.
<msqrt> − Used to display square root.
<mstyle> − Used to apply the style on its children.
<mstyle> − Used to apply the style on its children.
<msub> − Used to attach a subscript to an expression. It uses the following syntax: <msub> base subscript </msub>.
<msub> − Used to attach a subscript to an expression. It uses the following syntax: <msub> base subscript </msub>.
<msubsup> − Used to attach both a subscript and a superscript, together, to an expression. It uses the following syntax: <msubsup> base subscript superscript </msubsup>.
<msubsup> − Used to attach both a subscript and a superscript, together, to an expression. It uses the following syntax: <msubsup> base subscript superscript </msubsup>.
<msup> − Used to attach a superscript to an expression. It uses the following syntax: msup base superscript </msup>.
<msup> − Used to attach a superscript to an expression. It uses the following syntax: msup base superscript </msup>.
<mtable> − Provides options to create tables or matrices.
<mtable> − Provides options to create tables or matrices.
<mtd> − To represent a cell in a table or a matrix.
<mtd> − To represent a cell in a table or a matrix.
<mtext> − Used to render text with no notational meaning, such as comments or annotations.
<mtext> − Used to render text with no notational meaning, such as comments or annotations.
<mtr> − Represents a row in a table or a matrix.
<mtr> − Represents a row in a table or a matrix.
<munder> − Provides option to attach an accent or a limit under an expression. It uses the following syntax: <munder> base underscript </munder>
<munder> − Provides option to attach an accent or a limit under an expression. It uses the following syntax: <munder> base underscript </munder>
<munderover> − Provides option to attach accents or limits both under and over an expression. It uses the following syntax: </munderover> base underscript overscript </munderover>
<munderover> − Provides option to attach accents or limits both under and over an expression. It uses the following syntax: </munderover> base underscript overscript </munderover>
<semantics> − <semantics>,<annotation> and <annotation-xml> are used to add presentation and content markup and provides both, layout information and semantic meaning of mathematical expressions.
<semantics> − <semantics>,<annotation> and <annotation-xml> are used to add presentation and content markup and provides both, layout information and semantic meaning of mathematical expressions.
There are five basic elements of a MathML expression.
<math> element − It is top or root level element and is used to encapsulate each instance of MathML instance. Every valid MathML expression should be wrapped in outer <math> tag. It can contain any number of child elements. One math element cannot contain another math element tag.
<math> element − It is top or root level element and is used to encapsulate each instance of MathML instance. Every valid MathML expression should be wrapped in outer <math> tag. It can contain any number of child elements. One math element cannot contain another math element tag.
<mrow> element − It is used to group any number of sub expressions in horizontal way.
<mrow> element − It is used to group any number of sub expressions in horizontal way.
<mi> element − It is used to specify an identifier such as name of a variable, function or a constant etc. For example, <mi>PI</mi> .
<mi> element − It is used to specify an identifier such as name of a variable, function or a constant etc. For example, <mi>PI</mi> .
<mo> element − It is used to specify an operator like +, - etc. For example, <mo>+</mo>.
<mo> element − It is used to specify an operator like +, - etc. For example, <mo>+</mo>.
<mn> element − It is used to specify a numerical literal like 3.14 etc. For example, <mn>3.14</mn>.
<mn> element − It is used to specify a numerical literal like 3.14 etc. For example, <mn>3.14</mn>.
Let's build a simple mathematical equation a + b = 5 using MathML notation.
Here a, b are variables. + is an operator and 5 is a number. We'll enclose them as <mi>a</mi> , <mi>b</mi>, <mo>+</mo> and <mn>+</mn>
Syntax
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>  
      <mi>a</mi>  
      <mo>+</mo>  
      <mi>b</mi>  
   </mrow>
</math>
Output
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow> 
      <mrow>  
         <mi>a</mi>  
         <mo>+</mo>  
         <mi>b</mi>  
      </mrow>
      <mo>=</mo>  
      <mn>5</mn>  
   </mrow>
</math>
Output
The <mscarries> element can be used to create carries, borrows, and crossouts that occur in elementary math. The children of mscarries are associated with elements in the following row of the mstack. Each child of mscarries except <mscarry> or <none> is treated as being implicitly surrounded by mscarry. <none> is used when particular column don't need a carry. The mscarries element sets displaystyle to false, and increments scriptlevel by 1, so the children are typically displayed in a smaller font.
Here is the simple syntax to use this tag −
<mscarries> expression <mscarry> <none/> </mscarry> </mscarries>

Here is the description of all the parameters of this tag −
expression − expression on which carry/borrow is to be applied.
expression − expression on which carry/borrow is to be applied.
mscarry − carry tag.
mscarry − carry tag.
Here is the description of all the attributes of this tag −
position − to specify the horizontal position of the rows within this group relative the position determined by the containing msgroup.
position − to specify the horizontal position of the rows within this group relative the position determined by the containing msgroup.
location − to specify location of the carry or borrow relative to the character below it in the associated column. values are w, nw, n, ne, e, se, s, sw.
location − to specify location of the carry or borrow relative to the character below it in the associated column. values are w, nw, n, ne, e, se, s, sw.
crossout − to specify how the column content below each carry is crossed out; one or more values may be given and all values are drawn. Values are none, updiagonalstrike, downdiagonalstrike, verticalstrike, horizontalstrike. Default is none.
crossout − to specify how the column content below each carry is crossed out; one or more values may be given and all values are drawn. Values are none, updiagonalstrike, downdiagonalstrike, verticalstrike, horizontalstrike. Default is none.
scriptsizemultiplier − to specify the factor to change the font size by.
scriptsizemultiplier − to specify the factor to change the font size by.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mstack>
      <mscarries crossout='updiagonalstrike'>
         <mn>2</mn>
         <mn>12</mn>  
         <mscarry crossout='none'>
            <none/> 
         </mscarry>
      </mscarries>
      <mn>2,327</mn>
      
      <msrow>
         <mo>-</mo> 
         <mn> 1,156</mn> 
      </msrow>
      <msline/>
      <mn>1,171</mn>
   </mstack>
</math>
<menclose> tag is used to renders content inside the enclosing notation as specified by its notation attribute. it accepts a single argument as an inferred mrow of multiple children.
Here is the simple syntax to use this tag −
<menclose> expression </menclose>

Here is the description of all the parameters of this tag −
expression − expression.
expression − expression.
Here is the description of all the attributes of this tag −
notation − to specify a space separated list of notations to be used to enclose the children. Valid values are longdiv, actuarial, phasorangle, radical, box, roundedbox, circle, left, right, top, bottom, updiagonalstrike, downdiagonalstrike, verticalstrike, horizontalstrike, northeastarrow, madruwb, text. Default is longdiv.
notation − to specify a space separated list of notations to be used to enclose the children. Valid values are longdiv, actuarial, phasorangle, radical, box, roundedbox, circle, left, right, top, bottom, updiagonalstrike, downdiagonalstrike, verticalstrike, horizontalstrike, northeastarrow, madruwb, text. Default is longdiv.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mi>C</mi>
   <mrow>
      <menclose notation = 'phasorangle'>
         <mrow>
            <mo>−</mo>
            <mfrac>
               <mi>π</mi>
               <mn>2</mn>
            </mfrac>
         </mrow>
      </menclose>
   </mrow>
</math>
<mfenced> tag is a convenient method to use fencing operators like curly braces, brackets and parentheses instead of using <mo> tags for them.
Here is the simple syntax to use this tag −
<mfenced> expression </mfenced>

Here is the description of all the parameters of this tag −
expression − expression.
expression − expression.
Here is the description of all the attributes of this tag −
open − To specify the opening delimiter. Default is '('.
open − To specify the opening delimiter. Default is '('.
close − To specify the closing delimiter. Default is ')'.
close − To specify the closing delimiter. Default is ')'.
separators − To specify a sequence of zero or more separator characters, optionally separated by whitespace. Default is ','.
separators − To specify a sequence of zero or more separator characters, optionally separated by whitespace. Default is ','.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>
      <mo>(</mo>
      <mi>x</mi>
      <mo>)</mo>
   </mrow>
</math>
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mfenced>
      <mi>x</mi>
   </mfenced>
</math>
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>
      <mi> f </mi>
      <mo> ⁡</mo>
      <mfenced>
         <mi> x </mi>
         <mi> y </mi>
      </mfenced>
   </mrow>
</math>
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mfenced>
      <mrow>
         <mi> a </mi>
         <mo> + </mo>
         <mi> b </mi>
      </mrow>
   </mfenced>
</math>
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mfenced open="[">
      <mn> 0 </mn>
      <mn> 1 </mn>
   </mfenced>
</math>
<mfrac> tag is used to draw fractions.
Here is the simple syntax to use this tag −
<mfrac> numerator denominator </mfrac>

Here is the description of all the parameters of this tag −
numerator − numerator of the fraction.
numerator − numerator of the fraction.
denominator − denominator of the fraction.
denominator − denominator of the fraction.
Here is the description of all the attributes of this tag −
linethickness − to specify the stroke width of the fraction bar. values are measured in px, pt, em etc.
linethickness − to specify the stroke width of the fraction bar. values are measured in px, pt, em etc.
numalign − to specify alignment of numerator. values are left, right or center.
numalign − to specify alignment of numerator. values are left, right or center.
denomalign − to specify alignment of denominator. values are left, right or center.
denomalign − to specify alignment of denominator. values are left, right or center.
bevelled − to specify whether the fraction should be displayed vertically or inline. values are true or false.
bevelled − to specify whether the fraction should be displayed vertically or inline. values are true or false.
Let's draw a simple fraction for 1/x.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mfrac>
      <mn>1</mn>
      <mi>x</mi>
   </mfrac>
</math>
Let's build a complex fraction.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mfrac linethickness = '3px'>
      <mfrac bevelled = 'true'>
         <mn>1</mn>
         <mi>x</mi>
      </mfrac>
      
      <mrow>
         <mi>y</mi>
         <mo>-</mo>
         <mn>2</mn>
      </mrow>
   </mfrac>
</math>
<mlongdiv> tag is used to draw long divisions.
Here is the simple syntax to use this tag −
<mlongdiv> divisor dividend result expression </mlongdiv>

Here is the description of all the parameters of this tag −
divisor − divisor of the long division.
divisor − divisor of the long division.
dividend − dividend of the long division.
dividend − dividend of the long division.
result − result of the long division.
result − result of the long division.
expression − mstack element or children of mstack.
expression − mstack element or children of mstack.
Here is the description of all the attributes of this tag −
longdivstyle − to control the style of the long division layout. Valid values are lefttop, stackedrightright, mediumstackedrightright, shortstackedrightright, righttop, left/\right, left)(right, :right=right, stackedleftleft, stackedleftlinetop. Default is lefttop.
longdivstyle − to control the style of the long division layout. Valid values are lefttop, stackedrightright, mediumstackedrightright, shortstackedrightright, righttop, left/\right, left)(right, :right=right, stackedleftleft, stackedleftlinetop. Default is lefttop.
Let's draw a simple fraction for 1/x.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mlongdiv longdivstyle = "lefttop">
      <mn> 3 </mn>
      <mn> 435.3</mn>
      <mn> 1306</mn>
      <msgroup position = "2" shift = "-1">
         <msgroup>
            <mn> 12</mn>
            <msline length = "2"/>
         </msgroup>
         
         <msgroup>
            <mn> 10</mn>
            <mn> 9</mn>
            <msline length = "2"/>
         </msgroup>
         
         <msgroup>
            <mn> 16</mn>
            <mn> 15</mn>
            <msline length = "2"/>
            <mn> 1.0</mn>           
         </msgroup>   
         
         <msgroup position='-1'>   
            <mn> 9</mn>
            <msline length = "3"/>
            <mn> 1</mn>
         </msgroup>
      </msgroup>
   </mlongdiv>
</math>
<mtable> tag is used to draw matrices.
mtable is similar to table tag of HTML and this tag uses mtr, mtd elements which are similar to tr and td tags of HTML.
<mtable> <mtr> <mtd></mtd></mtr></mfrac>

Here is the description of all the attributes of this tag −
align − To specify the vertical alignment of the table . Valid values are: axis, baseline, bottom, center, top. Default is axis.
align − To specify the vertical alignment of the table . Valid values are: axis, baseline, bottom, center, top. Default is axis.
class, id, style − Used with stylesheets.
class, id, style − Used with stylesheets.
columnalign − To specify the horizontal alignment of the cells. Valid values are: left, center and right. Default is center.
columnalign − To specify the horizontal alignment of the cells. Valid values are: left, center and right. Default is center.
columnlines − To specify column borders. Valid values are: none, solid and dashed. Default is none.
columnlines − To specify column borders. Valid values are: none, solid and dashed. Default is none.
columnspacing − To specify the space between table columns.
columnspacing − To specify the space between table columns.
displaystyle − If true more vertical space is used for displayed equations , if false, a more compact layout is used to display formulas.
displaystyle − If true more vertical space is used for displayed equations , if false, a more compact layout is used to display formulas.
frame − To specify borders of the entire table. Valid values are: none, solid and dashed. Default is none.
frame − To specify borders of the entire table. Valid values are: none, solid and dashed. Default is none.
framespacing − To specify additional space added between the table and frame.
framespacing − To specify additional space added between the table and frame.
href − To specify a hyperlink to a specified uri.
href − To specify a hyperlink to a specified uri.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
rowalign − To specify vertical alignment of the cells. Valid values are axis, baseline, bottom, center and top. Default is baseline
rowalign − To specify vertical alignment of the cells. Valid values are axis, baseline, bottom, center and top. Default is baseline
rowlines − To specify row borders. Valid values are: none, solid and dashed. Default is none.
rowlines − To specify row borders. Valid values are: none, solid and dashed. Default is none.
width − To specify width of the entire table.
width − To specify width of the entire table.
Let's draw a 3 x 3 metric.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <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>
</math> 
<msgroup> is used to group rows inside <mstack> element and <mlongdiv> elements to have position relative to the alignment of stack. <msgroup> element with shift attribute can be used to create simple multiplications.
Here is the simple syntax to use this tag −
<msgroup> expression </msgroup>

Here is the description of all the parameters of this tag −
expression − expression.
expression − expression.
Here is the description of all the attributes of this tag −
position − to specify the horizontal position of the rows within the group relative the position controlled by the containing msgroup (as per its position and shift attributes). Default value is 0.
position − to specify the horizontal position of the rows within the group relative the position controlled by the containing msgroup (as per its position and shift attributes). Default value is 0.
shift − to specify an incremental shift of position for successive children (rows or groups) within the group. Default value is 0.
shift − to specify an incremental shift of position for successive children (rows or groups) within the group. Default value is 0.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mstack>
      <msgroup>
         <mn>123</mn>
         <msrow>
            <mo>×</mo>
            <mn>321</mn>
         </msrow>
      </msgroup>
      <msline/>
      
      <msgroup shift = "1">
         <mn>123</mn>
         <mn>246</mn>
         <mn>369</mn>
      </msgroup>
      <msline/>
      <mn>39483</mn>
   </mstack>
</math>
<mover> tag is used to draw overscript. It adds an accent or a limit over an expression.
Here is the simple syntax to use this tag −
<mover> base overscript </mover>

Here is the description of all the parameters of this tag −
base − base expression on which the overscript is to be drawn.
base − base expression on which the overscript is to be drawn.
overscript − overscript.
overscript − overscript.
Here is the description of all the attributes of this tag −
accent − If true, over-script is an accent, and is drawn closer to the base expression. If false, over-script is a limit over the base expression. Default is false.
accent − If true, over-script is an accent, and is drawn closer to the base expression. If false, over-script is a limit over the base expression. Default is false.
align − To specify the alignment of the over-script. Valid are: left, center, and right.
align − To specify the alignment of the over-script. Valid are: left, center, and right.
class, id, style − Used with stylesheets.
class, id, style − Used with stylesheets.
href − To specify a hyperlink to a specified uri.
href − To specify a hyperlink to a specified uri.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
Let's draw an overscript.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mover accent = "true">    
     <mrow>    
       <mi> x </mi>    
       <mo> + </mo>    
       <mi> y </mi>    
       <mo> + </mo>    
       <mi> z </mi>    
     </mrow>    
     <mo>&#x23DE;</mo>    
   </mover>
</math>
<mpadded> element is used to add padding, or extra space, around its content. It can be used to adjust size and positioning e.g. negative padding,which can cause the content of mpadded to overlap the rendering of neighboring content.
Here is the simple syntax to use this tag −
<mpadded> expression </mpadded>

Here is the description of all the parameters of this tag −
expression − inferred mrow of multiple children.
expression − inferred mrow of multiple children.
Here is the description of all the attributes of this tag −
height − To sets or increment the height of the mpadded element.
height − To sets or increment the height of the mpadded element.
depth − To sets or increment the depth of the mpadded element.
depth − To sets or increment the depth of the mpadded element.
width − To sets or increment the width of the mpadded element.
width − To sets or increment the width of the mpadded element.
lspace − To sets the horizontal space of the child content.
lspace − To sets the horizontal space of the child content.
voffset − To sets the vertical space of the child content.
voffset − To sets the vertical space of the child content.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>
      <mi>x</mi>
      <mpadded lspace = "0.2em" voffset = "0.3ex">
         <mi>y</mi>
      </mpadded>
      <mi>z</mi>
   </mrow>
</math>
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>
      <mi>x</mi>
      <mpadded width = "+90%width" height = "+0.3ex" depth = "+0.3ex">
         <mi>y</mi>
      </mpadded>
      <mi>z</mi>
   </mrow>
</math>
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>
      <mi>x</mi>
      <mpadded lspace = "0.3em" width = "+0.6em">
         <mi>y</mi>
      </mpadded>
      <mi>z</mi>
   </mrow>
</math>
<mphantom> element renders invisibly keeping same size and other dimensions, including baseline position, as its contents would have if they were rendered normally. It is used to align parts of an expression by invisibly duplicating sub-expressions.
Here is the simple syntax to use this tag −
<mphantom> expression </mphantom>

Here is the description of all the parameters of this tag −
expression − inferred mrow of multiple children.
expression − inferred mrow of multiple children.
Here is the description of all the attributes of this tag −
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mfrac>
      <mrow>
         <mi> x </mi>
         <mo> + </mo>
         <mi> y </mi>
         <mo> + </mo>
         <mi> z </mi>
      </mrow>
      
      <mrow>
         <mi> x </mi>
         <mphantom>
            <mo> + </mo>
         </mphantom>
         
         <mphantom>
            <mi> y </mi>
         </mphantom>
         <mo> + </mo>
         <mi> z </mi>
      </mrow>
   </mfrac>
</math>  
msqrt and mroot elements construct radicals. The msqrt element constructs square roots, while the mroot element constructs radicals with indices, for example a cube root.
<msqrt> tag is used to draw square root.
Here is the simple syntax to use this tag −
<msqrt> base </msqrt>

Here is the description of all the parameters of this tag −
base − base expression on which the square root is to be drawn.
base − base expression on which the square root is to be drawn.
Here is the description of all the attributes of this tag −
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
Let's draw a square root.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <msqrt>  
      <mn>4</mn>  
   </msqrt>
</math>
<mroot> tag is used to draw radicals with indices.
Here is the simple syntax to use this tag −
<mroot> base index </mroot>

Here is the description of all the parameters of this tag −
base − base expression on which the square root is to be drawn.
base − base expression on which the square root is to be drawn.
index − index of the root to be drawn.
index − index of the root to be drawn.
Here is the description of all the attributes of this tag −
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
Let's draw a cube root.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mroot>  
      <mn>8</mn>  
      <mn>3</mn>  
   </mroot>
</math> 
Decimal numbers having digit(s) that repeat(s) infinitely such as 1/3 (.3333...) are represented by putting a horizontal line over or below the digits that repeat. <mstack> , <msrow>, and <msline> elements can be used to create decimal numbers with repeated digits as shown below.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mstack stackalign = "right">
      <msline length = "1"/>
      <mn> 0.3333 </mn>
   </mstack>
</math>
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mstack stackalign="right">
      <msline length="6"/>
      <mn> 0.142857 </mn>
   </mstack>
</math> 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mstack stackalign="right">   
      <mn> 0.142857 </mn>
      <msline length="6"/>
   </mstack>
</math> 
<mstyle> tag is used to make style changes that affect the rendering of its contents.
Here is the simple syntax to use this tag −
<mstyle> expression </mstyle>

Here is the description of all the parameters of this tag −
expression − inferred mrow elements.
expression − inferred mrow elements.
Here is the description of all the attributes of this tag −
scriptlevel − To specify the scriptlevel for the children. Without a sign, it sets scriptlevel to the specified value; With a sign it increments ("+") or decrements ("-") the current value.
scriptlevel − To specify the scriptlevel for the children. Without a sign, it sets scriptlevel to the specified value; With a sign it increments ("+") or decrements ("-") the current value.
displaystyle − To specify the displaystyle.
displaystyle − To specify the displaystyle.
scriptsizemultiplier − To specify the multiplier to be used to adjust font size due to changes in scriptlevel.
scriptsizemultiplier − To specify the multiplier to be used to adjust font size due to changes in scriptlevel.
scriptminsize − To specify the minimum font size allowed due to changes in scriptlevel.
scriptminsize − To specify the minimum font size allowed due to changes in scriptlevel.
infixlinebreakstyle − To specify he default linebreakstyle to use for infix operators.
infixlinebreakstyle − To specify he default linebreakstyle to use for infix operators.
decimalpoint − To specify the character used to determine the alignment point within <mstack> and <mtable> columns when the "decimalpoint" value is used to specify the alignment. Default is '.'.
decimalpoint − To specify the character used to determine the alignment point within <mstack> and <mtable> columns when the "decimalpoint" value is used to specify the alignment. Default is '.'.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>
      <mo maxsize = "100%"> ( </mo>
      <mfrac> 
         <mi> a </mi> 
         <mi> b </mi> 
      </mfrac>
      <mo maxsize = "100%"> ) </mo>
   </mrow>
</math>
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mstyle maxsize = "100%">
      <mrow>
         <mo> ( </mo>
         <mfrac> 
            <mi> a </mi> 
            <mi> b </mi> 
         </mfrac>
         <mo> ) </mo>
      </mrow>
   </mstyle>
</math>
<msub> tag is used to draw subscript to an expression.
Here is the simple syntax to use this tag −
<msub> base subscript </msub>

Here is the description of all the parameters of this tag −
base − base expression on which the subscript is to be drawn.
base − base expression on which the subscript is to be drawn.
subscript − subscript.
subscript − subscript.
Here is the description of all the attributes of this tag −
subscriptshift − To specify the minimum space to shift the subscript below the baseline of the expression.
subscriptshift − To specify the minimum space to shift the subscript below the baseline of the expression.
class, id, style − Used with stylesheets.
class, id, style − Used with stylesheets.
href − To specify a hyperlink to a specified uri.
href − To specify a hyperlink to a specified uri.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
Let's draw a subscript.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <msub>  
      <mi>x</mi>  
      <mn>1</mn>  
   </msub>
</math> 
<msubsup> tag is used to attach both subscript and superscript to an expression.
Here is the simple syntax to use this tag −
<msubsup> base subscript superscript</msubsup>

Here is the description of all the parameters of this tag −
base − base expression on which the subscript and superscript is to be drawn.
base − base expression on which the subscript and superscript is to be drawn.
subscript − subscript.
subscript − subscript.
superscript − superscript.
superscript − superscript.
Here is the description of all the attributes of this tag −
subscriptshift − To specify the minimum space to shift the subscript below the baseline of the expression.
subscriptshift − To specify the minimum space to shift the subscript below the baseline of the expression.
superscriptshift − To specify the minimum space to shift the superscript above the baseline of the expression.
superscriptshift − To specify the minimum space to shift the superscript above the baseline of the expression.
Let's draw a subscript and superscript.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>
      <msubsup>
         <mo> ∫</mo>
         <mn> 0 </mn>
         <mn> 1 </mn>
      </msubsup>
      
      <mrow>
         <msup>
            <mi> e</mi>
            <mi> x </mi>
         </msup>
         <mo> ⁢</mo>
         
         <mrow>
            <mi> d</mi>
            <mi> x </mi>
         </mrow>
      </mrow>
   </mrow>
</math> 
<msup> tag is used to draw superscript to an expression.
Here is the simple syntax to use this tag −
<msup> base superscript </msup>

Here is the description of all the parameters of this tag −
base − base expression on which the superscript is to be drawn.
base − base expression on which the superscript is to be drawn.
superscript − superscript.
superscript − superscript.
Here is the description of all the attributes of this tag −
superscriptshift − To specify the minimum space to shift the superscript above the baseline of the expression.
superscriptshift − To specify the minimum space to shift the superscript above the baseline of the expression.
class, id, style − Used with stylesheets.
class, id, style − Used with stylesheets.
href − To specify a hyperlink to a specified uri.
href − To specify a hyperlink to a specified uri.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
Let's draw a superscript.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <msup>  
      <mi>x</mi>  
      <mn>1</mn>  
   </msup>
</math> 
Use mrow in order to add sub-expressions in superscripts.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <msup>  
      <mi>e</mi>  
      <mrow>  
         <mn>2</mn>  
         <mi>x</mi>  
         <mo>+</mo>  
         <mn>1</mn>  
      </mrow>   
   </msup>
</math>   
<munder> tag is used to draw underscript. It adds an accent or a limit under an expression.
Here is the simple syntax to use this tag −
<munder> base underscript </munder>

Here is the description of all the parameters of this tag −
base − base expression on which the underscript is to be drawn.
base − base expression on which the underscript is to be drawn.
underscript − underscript.
underscript − underscript.
Here is the description of all the attributes of this tag −
accentunder − If true, under-script is an accent, and is drawn closer to the base expression. If false, under-script is a limit over the base expression. Default is false.
accentunder − If true, under-script is an accent, and is drawn closer to the base expression. If false, under-script is a limit over the base expression. Default is false.
align − To specify the alignment of the under-script. Valid are: left, center, and right.
align − To specify the alignment of the under-script. Valid are: left, center, and right.
class, id, style − Used with stylesheets.
class, id, style − Used with stylesheets.
href − To specify a hyperlink to a specified uri.
href − To specify a hyperlink to a specified uri.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathbackground − To specify the background color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.
Let's draw an underscript.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <munder accent="true">    
     <mrow>    
       <mi> x </mi>    
       <mo> + </mo>    
       <mi> y </mi>    
       <mo> + </mo>    
       <mi> z </mi>    
     </mrow>    
     <mo>&#x23F;</mo>    
   </munder>
</math>
<munderover> tag is used to draw both over and under underscript. It adds an accent or a limit over and under an expression.
Here is the simple syntax to use this tag −
<munderover> base underscript overscript </munderover>

Here is the description of all the parameters of this tag −
base − base expression on which the underscript is to be drawn.
base − base expression on which the underscript is to be drawn.
underscript − underscript.
underscript − underscript.
overscript − overscript.
overscript − overscript.
Here is the description of all the attributes of this tag −
accent − If true, over-script is an accent, and is drawn closer to the base expression. If false, over-script is a limit over the base expression. Default is false.
accent − If true, over-script is an accent, and is drawn closer to the base expression. If false, over-script is a limit over the base expression. Default is false.
accentunder − If true, under-script is an accent, and is drawn closer to the base expression. If false, under-script is a limit over the base expression. Default is false.
accentunder − If true, under-script is an accent, and is drawn closer to the base expression. If false, under-script is a limit over the base expression. Default is false.
align − To specify the alignment of the under-script. Valid are: left, center, and right. Default is center.
align − To specify the alignment of the under-script. Valid are: left, center, and right. Default is center.
Let's draw an underscript.
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>
      <munderover>
         <mo> &#x222B;</mo>
         <mn> 0 </mn>
         <mi> &#x221E;</mi>
      </munderover>
   </mrow>
</math>
Following is a list of Algebra symbols available in MathML.
Following is a list of Calculus symbols available in MathML.
Following is a list of ellipses symbols available in MathML.
Following is a list of function symbols available in MathML.
Following is a list of geometry symbols available in MathML.
Following is a list of greek letters available in MathML.
Following is a list of invisible operators available in MathML.
Following is a list of logic symbols available in MathML.
Following is a list of set symbols available in MathML.
 Print
 Add Notes
 Bookmark this page