Fractions are other important part of mathematical expressions. They can have different forms, from a simple fraction to a complex one with many arguments. In this post we want to have a review on MathML tags for creating fractions . . .
The main form of the fractions, started with ‘<mfrac>‘, is:
<math xmlns=’http://www.w3.org/1998/Math/MathML’ display=’block’>
<mfrac>
<mn>1</mn>
<mi>ψ</mi>
</mfrac>
</math>
The two inputs are for the nominator and the dominator, respectively. The result is:
Like other MathML features, you can group the expressions by ‘<mrow>‘ and replace the single symbols:
<math xmlns=’http://www.w3.org/1998/Math/MathML’ display=’block’>
<mfrac>
<mn>1</mn>
<mrow>
<mi>ψ</mi>
<mo>+</mo>
<mn>2</mn>
</mrow>
</mfrac>
</math>
In the above example, the dominator is replaced by a group of expressions shown below:
Four attributes are available for the fractions: ‘numalign‘ and ‘denomalign‘ are used for the nominator and dominator alignment, respectively, with the values of ‘left‘, ‘right‘ and ‘center‘ (default); ‘linethickness‘ sets the fraction line thickness, and finally, if you set the ‘bevelled‘ to ‘true‘, the fraction would be in the inline form. The following examples illustrate them:
<math xmlns=’http://www.w3.org/1998/Math/MathML’ display=’block’>
<mfrac linethickness=”3px” numalign=”left”>
<mi>m</mi>
<mrow>
<mi>ψ</mi>
<mo>+</mo>
<mn>2</mn>
</mrow>
</mfrac>
</math>
<math xmlns=’http://www.w3.org/1998/Math/MathML’ display=’block’>
<mfrac bevelled=”true”>
<mn>1</mn>
<mn>2</mn>
</mfrac>
</math>
And their preview:
If you set the line thickness to zero, the line is vanished; it can be used for binomials:
<math xmlns=’http://www.w3.org/1998/Math/MathML’ display=’block’>
<mfrac linethickness=”0px”>
<mn>4</mn>
<mn>5</mn>
</mfrac>
</math>
This leads to:
And in our final example we have made a complex fraction:
<math xmlns=’http://www.w3.org/1998/Math/MathML’ display=’block’>
<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>…</mo>
</mrow>
<mrow>
<msup>
<mi>x</mi>
<mn>2</mn>
</msup>
<mo>+</mo>
<msup>
<mi>x</mi>
<mn>4</mn>
</msup>
<mo>+</mo>
<mo>…</mo>
</mrow>
</mfrac>
</math>
Before describing it see the result:
We have used a group of expressions in the nominator and another group for the dominator (shown in bold). In the first group, two simple inline fractions with some operators are used; and in the dominator, some superscripts mixed with other operators are took place.
Ask any question if exist, otherwise do dome practice and get ready for the next post . . .
Hi,
thank you for a good tutorial. I would like the user to be able to write fractions. Do you know to create an editor in html5?