MathML- Fractions

Written by @m_k_amin 29 May 2013

It is important to know how to write fractions, when you are typing mathematical equations and formulas. As you may know, there exist different formats for fractions. You can use horizontal or bevelled lines for the fractions and also put some fractions inside each other. In this code we have shown MathML fractions capability in experiment. We have shown how to insert different fractions even with no line at all; you can also see more complex examples about fractions below.

Code Snippet:

                                                
                                                <!-- this script is provided by https://www.html5freecode.com coded by: Kerixa Inc. -->
<!-- This Script is from www.html5freecode.com, Coded by: Kerixa Inc-->
<script type="text/javascript"
          src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<body style="font-size: 18pt;">

<math xmlns='http://www.w3.org/1998/Math/MathML' display='block'>
	<mfrac>
	 	<mn>1</mn>
		<mi>&psi;</mi>
	</mfrac>

	<mspace width="100px"/>

  	<mfrac bevelled="true">
    	<mn>1</mn>
    	<mn>2</mn>
  	</mfrac>
  
	<mspace width="100px"/>
		
  	<mfrac linethickness="0px">
    	<mn>4</mn>
    	<mn>5</mn>
  	</mfrac>

</math>

<math xmlns='http://www.w3.org/1998/Math/MathML' display='block'>
	<mfrac linethickness="3px" numalign="left">
		<mi>m</mi>
    	<mrow>
			<mi>&psi;</mi>
    		<mo>+</mo>
    		<mn>2</mn>
    	</mrow>
  	</mfrac>

	<mspace width="80px" />

	<mfrac>
		<mn>1</mn>
    	<mrow>
    		<mi>&psi;</mi>
    		<mo>+</mo>
    		<mn>2</mn>
		</mrow>
	</mfrac>
</math>

<math xmlns='http://www.w3.org/1998/Math/MathML' display='block'>
	<mspace height="40px"/>

  	<mfrac linethickness="2px" numalign="left" denomalign="left">
    	<mrow>
    		<mfrac bevelled="true">
    			<mn>1</mn>
    			<mi>x</mi>
    		</mfrac>
			<mo>+</mo>
    		<mfrac bevelled="true">
    			<mn>2</mn>
    			<mi>x</mi>
    		</mfrac>
			<mo>+</mo>
			<mo>&hellip;</mo>
    	</mrow>
    	<mrow>
    		<msup>
    			<mi>x</mi>
    			<mn>2</mn>
    		</msup>
			<mo>+</mo>    	
    		<msup>
    			<mi>x</mi>
    			<mn>4</mn>
    		</msup>
			<mo>+</mo>
			<mo>&hellip;</mo>    	
    	</mrow>
  	</mfrac>
</math>
</body>
<div style="text-align: center"><font face="Tahoma"><a target="_blank" href="http://www.html5freecode.com"><span style="font-size: 8pt; text-decoration: none">HTML5 Free Code</span></a></font></div><a target='_blank' href='https://www.html5freecode.com' style='font-size: 8pt; text-decoration: none'>Html5 Free Codes</a>

Example:

About @m_k_amin

This user is pending a biography.

Comments

Here you can leave us commments. Let us know what you think about this code tutorial!

0 / 300