MathML – Quick Guide


Table of Contents

MathML – Quick Guide

”;


Previous

Next

MathML – Overview

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.

Math on Web

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.

  • 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.

Example: Presentational Way

Syntax

Live Demo 
<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>&InvisibleTimes;</mo>
            <mi>x</mi>
         </mrow>
         <mo>+</mo>
         <mn>4</mn>
      </mrow>
      
      <mo>=</mo>
      <mn>0</mn>
   </mrow>
</math>

Output

x 2 + 4 &InvisibleTimes; x + 4 = 0

MathML – All Elements

  • <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.

  • <menclose> − Renders its content inside an enclosing notation specified by the notation attribute.

  • <merror> − Used to display contents as error message.

  • <mfenced> − Provides the option to add custom opening and closing parentheses and separators to an expression.

  • <mfrac> − Used to display fractions.

  • <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> .

  • <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.

  • <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>.

  • <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.

  • <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.

  • <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.

  • <mspace> − Used to display a blank space, where its size is set using its attributes.

  • <msqrt> − Used to display square root.

  • <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>.

  • <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>.

  • <mtable> − Provides options to create tables or matrices.

  • <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.

  • <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>

  • <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.

MathML – Basic Elements

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.

  • <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> .

  • <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>.

Example

Let”s build a simple mathematical equation a + b = 5 using MathML notation.

Step 1: Identification

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>

Step 2: Build Expression, a + b.

Syntax

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>  
      <mi>a</mi>  
      <mo>+</mo>  
      <mi>b</mi>  
   </mrow>
</math>

Output

a + b

Step 3: Build Expression, a + b = 5.

Live Demo 
<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

a + b = 5

MathML – Carries

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.

Syntax

Here is the simple syntax to use this tag −

<mscarries> expression <mscarry> <none/> </mscarry> </mscarries>

Parameters

Here is the description of all the parameters of this tag −

  • expression − expression on which carry/borrow is to be applied.

  • mscarry − carry tag.

Attributes

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.

  • 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.

  • scriptsizemultiplier − to specify the factor to change the font size by.

Example

Live Demo 
<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>

Output

2 12 2,327 – 1,156 1,171

MathML – Enclosing

<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.

Syntax

Here is the simple syntax to use this tag −

<menclose> expression </menclose>

Parameters

Here is the description of all the parameters of this tag −

  • expression − expression.

Attributes

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.

Example

Live Demo 
<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>

Output

C − π 2

MathML – Fencing

<mfenced> tag is a convenient method to use fencing operators like curly braces, brackets and parentheses instead of using <mo> tags for them.

Syntax

Here is the simple syntax to use this tag −

<mfenced> expression </mfenced>

Parameters

Here is the description of all the parameters of this tag −

  • expression − expression.

Attributes

Here is the description of all the attributes of this tag −

  • open − To specify the opening 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 ”,”.

Examples

Example 1: Without <mfenced> tag

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>
      <mo>(</mo>
      <mi>x</mi>
      <mo>)</mo>
   </mrow>
</math>

Output

( x )

Example 2: Using <mfenced> tag

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mfenced>
      <mi>x</mi>
   </mfenced>
</math>

Output

x

Example 3: f(x,y)

Live Demo 
<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>

Output

f ⁡ x y

Example 4: (a+b)

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mfenced>
      <mrow>
         <mi> a </mi>
         <mo> + </mo>
         <mi> b </mi>
      </mrow>
   </mfenced>
</math>

Output

a + b

Example 5: [0,1)

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mfenced open="[">
      <mn> 0 </mn>
      <mn> 1 </mn>
   </mfenced>
</math>

Output

0 1

MathML – Fractions

<mfrac> tag is used to draw fractions.

Syntax

Here is the simple syntax to use this tag −

<mfrac> numerator denominator </mfrac>

Parameters

Here is the description of all the parameters of this tag −

  • numerator − numerator of the fraction.

  • denominator − denominator of the fraction.

Attributes

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.

  • numalign − to specify alignment of numerator. 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.

Example

Let”s draw a simple fraction for 1/x.

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mfrac>
      <mn>1</mn>
      <mi>x</mi>
   </mfrac>
</math>

Output

1 x

Let”s build a complex fraction.

Live Demo 
<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>

Output

1 x y – 2

MathML – Long Division

<mlongdiv> tag is used to draw long divisions.

Syntax

Here is the simple syntax to use this tag −

<mlongdiv> divisor dividend result expression </mlongdiv>

Parameters

Here is the description of all the parameters of this tag −

  • divisor − divisor of the long division.

  • dividend − dividend of the long division.

  • result − result of the long division.

  • expression − mstack element or children of mstack.

Attributes

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.

Example

Let”s draw a simple fraction for 1/x.

Live Demo 
<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>

Output

3 435.3 1306 12 10 9 16 15 1.0 9 1

MathML – Matrices

<mtable> tag is used to draw matrices.

Syntax

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>

Attributes

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.

  • 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.

  • columnlines − To specify column borders. Valid values are: none, solid and dashed. Default is none.

  • 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.

  • 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.

  • href − To specify a hyperlink to a specified uri.

  • 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.

  • 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.

  • width − To specify width of the entire table.

Example

Let”s draw a 3 x 3 metric.

Live Demo 
<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>

Output

[ 1 0 0 0 1 0 0 0 1 ]

MathML – Multiplication

<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.

Syntax

Here is the simple syntax to use this tag −

<msgroup> expression </msgroup>

Parameters

Here is the description of all the parameters of this tag −

  • expression − expression.

Attributes

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.

  • shift − to specify an incremental shift of position for successive children (rows or groups) within the group. Default value is 0.

Example

Live Demo 
<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>

Output

123 × 321 123 246 369 39483

MathML – Overscript

<mover> tag is used to draw overscript. It adds an accent or a limit over an expression.

Syntax

Here is the simple syntax to use this tag −

<mover> base overscript </mover>

Parameters

Here is the description of all the parameters of this tag −

  • base − base expression on which the overscript is to be drawn.

  • overscript − overscript.

Attributes

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.

  • align − To specify the alignment of the over-script. Valid are: left, center, and right.

  • class, id, style − Used with stylesheets.

  • href − To specify a hyperlink to a specified uri.

  • 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.

Example

Let”s draw an overscript.

Live Demo 
<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>

Output

x + y + z ⏞

MathML – Padding

<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.

Syntax

Here is the simple syntax to use this tag −

<mpadded> expression </mpadded>

Parameters

Here is the description of all the parameters of this tag −

  • expression − inferred mrow of multiple children.

Attributes

Here is the description of all the attributes of this tag −

  • height − To sets or increment the height 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.

  • lspace − To sets the horizontal space of the child content.

  • voffset − To sets the vertical space of the child content.

Examples

Example 1

Live Demo 
<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>

Output

x y z

Example 2

Live Demo 
<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>

Output

x y z

Example 3

Live Demo 
<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>

Output

x y z

MathML – Phantom

<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.

Syntax

Here is the simple syntax to use this tag −

<mphantom> expression </mphantom>

Parameters

Here is the description of all the parameters of this tag −

  • expression − inferred mrow of multiple children.

Attributes

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.

Examples

Live Demo 
<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>

Output

x + y + z x + y + z

MathML – Radicals

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> element

<msqrt> tag is used to draw square root.

Syntax

Here is the simple syntax to use this tag −

<msqrt> base </msqrt>

Parameters

Here is the description of all the parameters of this tag −

  • base − base expression on which the square root is to be drawn.

Attributes

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.

  • mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.

Example

Let”s draw a square root.

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <msqrt>  
      <mn>4</mn>  
   </msqrt>
</math>

Output

4

<mroot> element

<mroot> tag is used to draw radicals with indices.

Syntax

Here is the simple syntax to use this tag −

<mroot> base index </mroot>

Parameters

Here is the description of all the parameters of this tag −

  • base − base expression on which the square root is to be drawn.

  • index − index of the root to be drawn.

Attributes

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.

  • mathcolor − To specify the text color. Valid formats are #rgb, #rrggbb and html color names.

Example

Let”s draw a cube root.

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mroot>  
      <mn>8</mn>  
      <mn>3</mn>  
   </mroot>
</math>

Output

8 3

MathML – Repeating Decimals

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.

Example

Example 1

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mstack stackalign = "right">
      <msline length = "1"/>
      <mn> 0.3333 </mn>
   </mstack>
</math>

Output

0.3333

Example 2

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mstack stackalign="right">
      <msline length="6"/>
      <mn> 0.142857 </mn>
   </mstack>
</math>

Output

0.142857

Example 3

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mstack stackalign="right">   
      <mn> 0.142857 </mn>
      <msline length="6"/>
   </mstack>
</math>

Output

0.142857

MathML – Style

<mstyle> tag is used to make style changes that affect the rendering of its contents.

Syntax

Here is the simple syntax to use this tag −

<mstyle> expression </mstyle>

Parameters

Here is the description of all the parameters of this tag −

  • expression − inferred mrow elements.

Attributes

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.

  • displaystyle − To specify the displaystyle.

  • 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.

  • 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 ”.”.

Examples

Example 1: Without <mstyle> tag

Live Demo 
<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>

Output

( a b )

Example 2: Using <mstyle> tag

Live Demo 
<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>

Output

( a b )

MathML – Subscripts

<msub> tag is used to draw subscript to an expression.

Syntax

Here is the simple syntax to use this tag −

<msub> base subscript </msub>

Parameters

Here is the description of all the parameters of this tag −

  • base − base expression on which the subscript is to be drawn.

  • subscript − subscript.

Attributes

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.

  • class, id, style − Used with stylesheets.

  • href − To specify a hyperlink to a specified uri.

  • 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.

Example

Let”s draw a subscript.

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <msub>  
      <mi>x</mi>  
      <mn>1</mn>  
   </msub>
</math>

Output

x 1

MathML – Subscript-Superscript

<msubsup> tag is used to attach both subscript and superscript to an expression.

Syntax

Here is the simple syntax to use this tag −

<msubsup> base subscript superscript</msubsup>

Parameters

Here is the description of all the parameters of this tag −

  • base − base expression on which the subscript and superscript is to be drawn.

  • subscript − subscript.

  • superscript − superscript.

Attributes

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.

  • superscriptshift − To specify the minimum space to shift the superscript above the baseline of the expression.

Example

Let”s draw a subscript and superscript.

Live Demo 
<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>

Output

∫ 0 1 e x ⁢ d x

MathML – Superscripts

<msup> tag is used to draw superscript to an expression.

Syntax

Here is the simple syntax to use this tag −

<msup> base superscript </msup>

Parameters

Here is the description of all the parameters of this tag −

  • base − base expression on which the superscript is to be drawn.

  • superscript − superscript.

Attributes

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.

  • class, id, style − Used with stylesheets.

  • href − To specify a hyperlink to a specified uri.

  • 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.

Example

Let”s draw a superscript.

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <msup>  
      <mi>x</mi>  
      <mn>1</mn>  
   </msup>
</math>

Output

x 1

Grouping sub expressions

Use mrow in order to add sub-expressions in superscripts.

Live Demo 
<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>

Output

e 2 x + 1

MathML – Underscript

<munder> tag is used to draw underscript. It adds an accent or a limit under an expression.

Syntax

Here is the simple syntax to use this tag −

<munder> base underscript </munder>

Parameters

Here is the description of all the parameters of this tag −

  • base − base expression on which the underscript is to be drawn.

  • underscript − underscript.

Attributes

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.

  • align − To specify the alignment of the under-script. Valid are: left, center, and right.

  • class, id, style − Used with stylesheets.

  • href − To specify a hyperlink to a specified uri.

  • 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.

Example

Let”s draw an underscript.

Live Demo 
<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>

Output

x + y + z ȿ

MathML – Underscript-Overscript

<munderover> tag is used to draw both over and under underscript. It adds an accent or a limit over and under an expression.

Syntax

Here is the simple syntax to use this tag −

<munderover> base underscript overscript </munderover>

Parameters

Here is the description of all the parameters of this tag −

  • base − base expression on which the underscript is to be drawn.

  • underscript − underscript.

  • overscript − overscript.

Attributes

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.

  • 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.

Example

Let”s draw an underscript.

Live Demo 
<math xmlns = "http://www.w3.org/1998/Math/MathML">
   <mrow>
      <munderover>
         <mo> &#x222B;</mo>
         <mn> 0 </mn>
         <mi> &#x221E;</mi>
      </munderover>
   </mrow>
</math>

Output

∫ 0 ∞

MathML – Algebra Symbols

Following is a list of Algebra symbols available in MathML.

MathML Symbol HTML Entity Hex Code Description
– &minus; &#x2212; To specify subtraction
× &times; &#x00d7; To specify multiplication
÷ &divide; &#x00f7; To specify division
≠ &ne; &#x2260; To specify not equals
≈ &asymp; &#x2248; To specify approximately equals
< &lt; &#x003c; To specify less than
≤ &le; &#x2264; To specify less than or equals
> &gt; &#x003e; To specify greater than
≥ &ge; &#x2265; To specify greater than or equal
± &plusmn; &#x00b1; To specify plus or minus
∝ &prop; &#x221d; To specify proportional to
∑ &sum; &#x2211; To specify summation
∏ &prod; &#x220f; To specify product
⌊ &lfloor; &#x230a; To specify left floor
⌋ &rfloor; &#x230b; To specify right floor
⌈ &lceil; &#x2308; To specify left ceiling
⌉ &rceil; &#x2309; To specify right ceiling

MathML – Calculus Symbols

Following is a list of Calculus symbols available in MathML.

MathML Symbol HTML Entity Hex Code Description
′ &prime; &#x2032; Prime (1st derivative)
″ &prime; &#x2033; Double prime (2nd derivative)
‴ &tprime; &#x2034; Triple prime (3nd derivative)
∂ &part; &#x2202; To specify partial differential
δ &delta; &#x0394; To specify increment
∇ &del; &#x2207; To specify gradient
∫ &int; &#x222b; To specify integral
∬ &int; &#x222c; To specify double integral
∭ &tint; &#x222d; To specify triple integral
⨌ &qint; &#x2a0c; To specify quadruple integral
∮ &conint; &#x222e; To specify contour integral
∲ &cwconint; &#x2232; To specify clockwise contour integral
∳ &awconint; &#x2233; To specify anticlockwise contour integral
∯ &conint; &#x222f; To specify surface integral
∰ &cconint; &#x2230; To specify volume integral
∞ &infin; &#x221e; To specify infinity

MathML – Ellipses Symbols

Following is a list of ellipses symbols available in MathML.

MathML Symbol HTML Entity Hex Code Description
… &hellip; &#x2026; To specify horizontal ellipsis
⋮ &vellip; &#x22ee; To specify vertical ellipsis
⋯ &ctdot; &#x22ef; To specify midline horizontal ellipsis
⋰ &utdot; &#x22f0; To specify diagonal ellipsis
⋱ &dtdot; &#x22f1; To specify downright diagonal ellipsis

MathML – Function Symbols

Following is a list of function symbols available in MathML.

MathML Symbol HTML Entity Hex Code Description
⋅ &sdot; &#x22c5; To specify dot product
⨯ &cross; &#x2a2f; To specify cross product
‖ &vert; &#x2016; To specify norm (magnitude) bars
⟨ &lang; &#x27e8; To specify left angle bracket
⟩ &rang; &#x27e9; To specify right angle bracket
∘ &compfn; &#x2218; To specify function composition
→ &rarr; &#x2192; To specify general function mapping
↦ &mapsto; &#x21a6; To specify concrete function mapping
ı &imath; &#x0131; To specify dotless i
ȷ &jmath; &#x0237; To specify dotless j

MathML – Geometry Symbols

Following is a list of geometry symbols available in MathML.

MathML Symbol HTML Entity Hex Code Description
° &deg; &#x00b0; To specify degrees
∠ &ang; &#x2220; To specify angle
∡ &angmsd; &#x2221; To specify measured angle
∟ &angrt; &#x221f; To specify right angle
⦜ &vangrt; &#x299c; To specify right angle with square
⊿ &lrtri; &#x22bf; To specify right triangle
○ &cir; &#x25cb; To specify circle
△ &xutri; &#x25b3; To specify triangle
□ &squ; &#x25a1; To specify square
▱ &fltns; &#x25b1; To specify parallelogram
∥ &spar; &#x2225; To specify parallel
∦ &npar; &#x2226; To specify not parallel
⊥ &perp; &#x22a5; To specify perpendicular
≅ &cong; &#x2245; To specify congruent
→ &rarr; &#x2192; To specify ray (used with <mover>)
↔ &harr; &#x2194; To specify line (used with <mover>)
– (n/a) &#x002d; To specify line segment (used with <mover>)

MathML – Greek Letters

Following is a list of greek letters available in MathML.

Capital Letter (C) Small Letter (S) Entities(C) Entities(S) Hex Codes(C) Hex Codes(S)
Α α &alpha; &alpha; &#x0391; &#x03b1;
Β β &beta; &beta; &#x0392; &#x03b2;
Γ γ &gamma; &gamma; &#x0393; &#x03b3;
Δ δ &delta; &delta; &#x0394; &#x03b4;
Ε ε &epsilon; &epsilon; &#x0395; &#x03b5;
Ζ ζ &zeta; &zeta; &#x0396; &#x03b6;
Η η &eta; &eta; &#x0397; &#x03b7;
Θ θ &theta; &theta; &#x0398; &#x03b8;
Ι ι &iota; &iota; &#x0399; &#x03b9;
Κ κ &kappa; &kappa; &#x039a; &#x03ba;
Λ λ &lambda; &lambda; &#x039b; &#x03bb;
Μ μ &mu; &mu; &#x039c; &#x03bc;
Ν ν &nu; &nu; &#x039d; &#x03bd;
Ξ ξ &xi; &xi; &#x039e; &#x03be;
Ο ο &omicron; &omicron; &#x039f; &#x03bf;
Π π &pi; &pi; &#x03a0; &#x03c0;
Ρ ρ &rho; &rho; &#x03a1; &#x03c1;
Σ σ &sigma; &sigma; &#x03a3; &#x03c3;
Τ τ &tau; &tau; &#x03a4; &#x03c4;
Υ υ &upsilon; &upsilon; &#x03a5; &#x03c5;
Φ φ &phi; &phi; &#x03a6; &#x03c6;
Χ χ &chi; &chi; &#x03a7; &#x03c7;
Ψ ψ &psi; &psi; &#x03a8; &#x03c8;
Ω ω &omega; &omega; &#x03a9; &#x03c9;

MathML – Invisible Operators

Following is a list of invisible operators available in MathML.

Entity Short Entity Hex Description
&applyfunction; &af; &#x2061; It is used to specify function application
&invisibletimes; &it; &#x2062; It is used to specify invisible multiplication
&invisiblecomma; &ic; &#x2063; It is used to specify invisible separator
(n/a) (n/a) &#x2064; It is used to specify invisible addition

MathML – Logic Symbols

Following is a list of logic symbols available in MathML.

MathML Symbol HTML Entity Hex Code Description
¬ &not; &#x00ac; To specify negation
∧ &and; &#x2227; To specify logical conjunction
∨ &or; &#x2228; To specify logical disjunction
⊻ &veebar; &#x22bb; To specify exclusive disjunction
∀ &forall; &#x2200; To specify universal quantification
∃ &exist; &#x2203; To specify existential quantification
⇒ &rarr; &#x21d2; To specify material implication
⇔ &harr; &#x21d4; To specify material equivalence
◻ &emptysmallsquare; &#x25fb; To specify necessarily
◊ &loz; &#x25ca; To specify possibly
⊢ &vdash; &#x22a2; To specify provable
⊨ &vdash; &#x22a8; To specify entails
∴ &there4; &#x2234; To specify therefore

MathML – Set Symbols

Following is a list of set symbols available in MathML.

MathML Symbol HTML Entity Hex Code Description
∅ &empty; &#x2205; To specify the empty set
∈ &isin; &#x2208; To specify the member of set
∉ &notin; &#x2209; It specifies not a member of set
⊆ &sube; &#x2286; To specify a subset
⊈ &nsube; &#x2288; To specify not a subset
⊂ &sub; &#x2282; To specify a strict subset
⊄ &nsub; &#x2284; To specify not a strict subset
⊇ &supe; &#x2287; To specify a superset
⊉ &nsupe; &#x2289; To specify not a superset
⊃ &sup; &#x2283; To specify strict superset
⊅ &nsup; &#x2285; To specify not a strict superset
∩ &cap; &#x2229; To specify intersection
∪ &cup; &#x222a; To specify union
∖ &ssetmn; &#x2216; To specify complement



Print Page




Previous



Next


Advertisements

”;

Leave a Reply

Your email address will not be published. Required fields are marked *