HTML5 | MathML Introduction

The MathML comes in the HTML5 the current MathML version is 3 it was introduced in the year of 2015. The MathML stands for Mathematics Markup Language. It is used to represent the mathematical equation or expression in web browsers like other HTML elements. The 1st version of MathML released in the year of 1998 and after that in the 2nd version was released. Basically MathML is a complex mathematical formula or equation visual representation made easy. The MathML is supported in the HTML5, all the MathML tag must be used inside the <math> and </math> tags.

The MathML is used to describing mathematics as a basis for the machine to machine communication, it is intended handling by specialized authoring tools such as equation editors and it is meaningful to other applications also.

MathML is not-capable:

  • The MathML is not a calculator to calculate or solve complex equation it is just a way to show the equation.
  • It is not a programming language it is a Mathematics Markup Language.

MathML is capable:

  • The MathML can be used to represent the Matrix form.
  • The MathML can be used to represent the Partial Differential Equation.
  • The MathML can be used to represent the Chemical Reaction Equation.

Below example gives you a brief idea about MathML:
Example:



filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>HTML5 MathML</title>
</head>
  
<body style="text-align:center;">
  
    <h1 style="color:green"
        GeeksforGeeks 
    </h1>
  
    <h3>HTML5 MathML</h3>
  
    <!--start tag of the whole representation-->
    <math>
          
        <!-- Creating Matrix -->
        <mrow>
            <mi>A</mi>
            <mo>=</mo>
  
            <mfenced open="[" close="]">
  
                <mtable>
                    <mtr>
                        <mtd>
                            <mi>a</mi>
                        </mtd>
                        <mtd>
                            <mi>b</mi>
                        </mtd>
                    </mtr>
  
                    <mtr>
                        <mtd>
                            <mi>x</mi>
                        </mtd>
                        <mtd>
                            <mi>y</mi>
                        </mtd>
                    </mtr>
  
                </mtable>
  
            </mfenced>
        </mrow>
        
        <!-- Creating equation -->
        <br><br>
        <msub>
            <mi>Geeks</mi>
            <mn>4</mn>
        </msub>
        <mo>+</mo>
        <mn>Geeks</mn>
        <mo>=</mo>
        <msub>
            <mi>G</mi>
        </msub>
        <mo>→</mo>
        <msub>
            <mi>e</mi>
            <mn>2</mn>
        </msub>
        <mo>→</mo>
        <mi>k</mi>
        <mi>s</mi>
        <mn>4
        </mn>
        <msub>
            <mi>G</mi>
        </msub>
        <mo>→</mo>
        <msub>
            <mi>e</mi>
            <mn>2</mn>
        </msub>
        <mo>→</mo>
        <mi>k</mi>
        <mi>s</mi>
    </math>
</body>
  
</html>

chevron_right


Output:

Note: There are almost 30+ MathML tags available. All the tags aew lised below in table format:

Tag Description
MathML <math> tag MathML element you want to use they should wrapped inside of the <math> tag.
MathML <maction> tag This tag is used to show the bind action of any expression.
MathML <menclose> Tag This tag is used to renders the contents which is inside of anbenclosing notation specified by the notation attribute.
MathML <merror> Tag This tag is used to wrap the expression in a box, makes that expression eye-catching.
MathML <mfenched> tag This tag is used to add custom open and closing parentheses.
MathML <mfrac> tag This tag is use to add fraction symbol between two digits or equations.
MathML <mglyph> Tag This tag is used only for those characters or symbols that are not available on Unicode characters.
MathML <mi> Tag This tag is used as an identifier such as any kind of symbol or function. You can put any statement inside this tag.
MathML <mlabeledtr> tag This tag is used to represent a label in a row, either on the left or on the right side inside of the <mtable> element.
MathML <mmultiscripts> Tag This tag is used to create multi-dimensional matrices. The degree depends on the conditionality of a representative array.
MathML <mn> Tag THis tag is used to display a numeric character which is normally a sequence of digits with a possible separator.
MathML <mo> Tag This tag is used print operator between elements. Any kind of mathematical operator can be used by this tag.
MathML <mover> Tag This tag is used used to attach an accent or a limit over an expression.
MathML <mpadded> Tag This tag is used to add extra padding and to set the general adjustment of position and size of enclosed contents.
MathML <mphantom> Tag It is used to rendered invisibly but the dimensional are still kept.
MathML <mroot> Tag This tag is use to display the power of the root like root squire.
MathML <mrow> Tag This tag is used to create a row that contains some mathematical expression or any random text.
MathML <ms> Tag This tag is used to represent string that will represent the mathematical expression by programming languages and computer algebra systems.
MathML <mspace> Tag This tag is used to print blank space. The size of the blank space has to be mentioned in the attributes.
MathML <msqrt> Tag It is use to display the root squire of the element content.
MathML <style> Tag It is an inbuild tag in HTML5. This tag is used to change the styles of the children elements.
MathML <msub> Tag It is used to print the base power on any expression.
MathML <msubsup> Tag It is used to print base power and power on any expression.
MathML <msup> Tag It is is used to print power on any expression.
MathML <mtable> Tag This tag is similar to the normal HTML <table> tag.
MathML <mtd> Tag This tag is used to create table data of a table or the matrices in HTML5
MathML <mtext> Tag This tag is used to print any text before after any expression.
MathML <mtr> Tag This tag is used to create row of a table or the matrices in HTML5.
MathML <mth> Tag This tag is used to create header of a table or the matrices in HTML5.
MathML <munder> Tag This tag is used attach any accent or limit under the expression.
MathML <munderover> Tag This tag is used attach any accent or limit under the expression plus over the expression.
MathML <semantics> Tag This tag is used to markup the mathematics there are two possible ways to markup mathematics

Supported Browsers: The browsers supported by HTML5 MathML tags are listed below:

  • Firefox

full-stack-img




My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.


Article Tags :
Practice Tags :


Be the First to upvote.


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.