HTML5 MathML mathvariant Attribute

The MathML mathvariant attribute in HTML5 is used to specify the logical class used for displaying the text. This can be used to vary the typography of the text displayed. All the possible values that this attribute supports are normal, bold, italic, bold-italic, double-struck, bold-fraktur, script, bold-script, fraktur, sans-serif, bold-sans-serif, sans-serif-italic, sans-serif-bold-italic, monospace, initial, tailed, looped, and stretched. This attribute is accepted by the <mi>, <mn>, <mo>, <ms> and <mtext> tags.

Syntax:

<element mathvariant="logical class">

Attribute Values: This attribute has a single value as mentioned above and described below:

  • logical class: This value sets the logical class of the element to one of the available values.

The examples below illustrate the MathML mathvariant attribute:

Example 1: 

HTML




<!DOCTYPE html>
<html>
  
<body style="text-align:center;">
    <h1 style="color:green">
        w3wiki
    </h1>
  
    <h3>HTML5 MathML mathvariant Attribute</h3>
      
    <math>
        <ms lquote="„" rquote=" “" 
            mathcolor="Red" 
            mathvariant="sans-serif">
            A Computer Science Portal for Beginner
        </ms>
    </math>
</body>
  
</html>


Output:

Example 2:

HTML




<!DOCTYPE html>
<html>
  
<body style="text-align:center;">
  
    <h1 style="color:green">
        w3wiki
    </h1>
      
    <h3>HTML5 MathML mathvariant Attribute</h3>
      
    <math>
        <ms lquote="„" rquote=" “" 
            mathcolor="Red" mathvariant="fraktur">
            A Computer Science Portal for Beginner
        </ms>
    </math>
</body>
  
</html>


Output:

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

  • Firefox