Skip to content
Related Articles

Related Articles

Improve Article

HTML5 MathML mathvariant Attribute

  • Last Updated : 18 Nov, 2020

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">
        GeeksforGeeks
    </h1>
  
    <h3>HTML5 MathML mathvariant Attribute</h3>
      
    <math>
        <ms lquote="„" rquote=" “" 
            mathcolor="Red" 
            mathvariant="sans-serif">
            A Computer Science Portal for Geeks
        </ms>
    </math>
</body>
  
</html>

Output:

Example 2:

HTML




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

Output:

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

  • Firefox

Attention reader! Don’t stop learning now. Get hold of all the important Comcompetitivepetitve Programming concepts with the Web Design for Beginners | HTML  course.




My Personal Notes arrow_drop_up
Recommended Articles
Page :