MathML- Graphical Styles (Line Breaks and Indentation)
Written by 2 June 2013
When a mathematical expression has long length, it must go to new line. HTML5 MathML has predicted a feature for newlines. You can do it manually and when it is needed put a line break. Also it is possible to start the expression at the new line, some distances farther than the page margin; this feature is called indentation. In the following code we have illustrated the HTML5 MathML capability for breaking a line and using Indentation.
Code Snippet:
<!-- this script is provided by http://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: 16pt;">
<math xmlns='http://www.w3.org/1998/Math/MathML' display='block' indentalign="left">
<msup superscriptshift ="15px">
<mi>x</mi>
<mi>n</mi>
</msup>
<mo>+</mo>
<msup superscriptshift ="15px">
<mi>x</mi>
<mrow>
<mi>n</mi>
<mo>-</mo>
<mn>1</mn>
</mrow>
</msup>
<mo>+</mo>
<mo>…</mo>
<mspace linebreak='newline'/>
<mspace height="30px"/>
<mo>…</mo>
<mo>+</mo>
<msup superscriptshift ="15px">
<mi>x</mi>
<mn>1</mn>
</msup>
<mo>+</mo>
<msup superscriptshift ="15px">
<mi>x</mi>
<mn>0</mn>
</msup>
<mo linebreak='newline' linebreakstyle='before' indentshift='60pt'>=</mo>
<msubsup subscriptshift ="10px" superscriptshift ="15px">
<mi>q</mi>
<mi>n</mi>
<mi>n</mi>
</msubsup>
<mo>+</mo>
<msubsup subscriptshift ="10px" superscriptshift ="15px">
<mi>q</mi>
<mrow>
<mi>n</mi>
<mo>-</mo>
<mn>1</mn>
</mrow>
<mrow>
<mi>n</mi>
<mo>-</mo>
<mn>1</mn>
</mrow>
</msubsup>
<mo>+</mo>
<mo>…</mo>
<mo linebreak='newline' linebreakstyle='before' indentshift='70pt'>+</mo>
<mo>…</mo>
<mspace height="30px"/>
<msubsup subscriptshift ="10px" superscriptshift ="15px">
<mi>q</mi>
<mn>1</mn>
<mn>1</mn>
</msubsup>
<mo>+</mo>
<msubsup subscriptshift ="10px" superscriptshift ="15px">
<mi>q</mi>
<mn>0</mn>
<mn>0</mn>
</msubsup>
</math>
<div style="text-align: left"><font face="Tahoma"><br><a target="_blank" href="http://www.html5freecode.com"><span style="font-size: 8pt; text-decoration: none">HTML5 Free Code</span></a></font></div>
</body><a target='_blank' href='http://www.html5freecode.com' style='font-size: 8pt; text-decoration: none'>Html5 Free Codes</a>
Example:
Let's stay in touch
Get the latest and greatest javascript codes directly to your mail
TRENDING POST
VISITORS
Online Users:
12
Recent Members:
FOTPU
Comments
Here you can leave us commments. Let us know what you think about this code tutorial!