gecko-dev/layout/mathml/tests/mixing.xml

146 lines
4.7 KiB
XML

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "mathml.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:html="http://www.w3.org/1999/xhtml"
xmlns:math="http://www.w3.org/1998/Math/MathML"
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
>
<!--
* The contents of this file are subject to the Mozilla Public
* License Version 1.1 (the "License"); you may not use this file
* except in compliance with the License. You may obtain a copy of
* the License at http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS
* IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or
* implied. See the License for the specific language governing
* rights and limitations under the License.
*
* The Original Code is Mozilla MathML Project.
*
* The Initial Developer of the Original Code is The University of
* Queensland. Portions created by The University of Queensland are
* Copyright (C) 1999 The University of Queensland. All
* Rights Reserved.
*
* Contributor(s):
* Roger B. Sidje <rbs@maths.uq.edu.au>
-->
<head>
<title>Mixing MathML with other markup</title>
</head>
<body style="font-size: 18pt; background-color: gold; background-image: url(resource:/res/samples/raptor.jpg); background-repeat: no-repeat; background-attachment: fixed;">
<h2 style="text-align: center; color: blue">
Mixing MathML markups and other markups to get special effects</h2>
<br />
A fraction with the animated throbber as denominator...
View the source...
<math mode="display" xmlns="http://www.w3.org/1998/Math/MathML">
<mfrac linethickness="3">
<mi>a</mi>
<html:img src="resource:/chrome/skins/modern/global/skin/animthrob.gif" />
</mfrac>
</math>
<br />
See the difference between &lt;mi&gt; an &lt;html:i&gt;
(which doesn't understand the scriptlevel) :
<math mode="display" xmlns="http://www.w3.org/1998/Math/MathML">
<mfrac>
<mi>a</mi>
<mi>a</mi>
</mfrac>
&nbsp;
<mfrac>
<html:i>a</html:i>
<html:i>a</html:i>
</mfrac>
</math>
<br />
And there could be more...
<div style="text-align: center">
<button style="background-color:rgb(192,192,192)">
<span style="color: brown;">
For example, a MathML continued fraction inside a HTML button<br />
</span>
<math xmlns="&mathml;">
<mrow>
<mfrac>
<mi>&pi;</mi>
<mn>4</mn>
</mfrac>
<mo>=</mo>
<mfrac numalign="left">
<mstyle scriptlevel="0">
<mn>1</mn>
</mstyle>
<mstyle scriptlevel="0">
<mrow>
<mn>2</mn>
<mo>+</mo>
<mfrac numalign="left">
<mstyle scriptlevel="0">
<msup><mn>1</mn><mn>2</mn></msup>
</mstyle>
<mstyle scriptlevel="0">
<mrow>
<mn>2</mn>
<mo>+</mo>
<mfrac numalign="left">
<mstyle scriptlevel="0">
<msup><mn>3</mn><mn>2</mn></msup>
</mstyle>
<mstyle scriptlevel="0">
<mrow>
<mn>2</mn>
<mo>+</mo>
<mfrac numalign="left">
<mstyle scriptlevel="0">
<msup><mn>5</mn><mn>2</mn></msup>
</mstyle>
<mstyle scriptlevel="0">
<mrow>
<mn>2</mn>
<mo>+</mo>
<mfrac numalign="left">
<mstyle scriptlevel="0">
<msup><mn>7</mn><mn>2</mn></msup>
</mstyle>
<mstyle scriptlevel="0">
<mn>2</mn><mo>+</mo><mo fontweight="bold">...</mo>
</mstyle>
</mfrac>
</mrow>
</mstyle>
</mfrac>
</mrow>
</mstyle>
</mfrac>
</mrow>
</mstyle>
</mfrac>
</mrow>
</mstyle>
</mfrac>
</mrow>
</math>
</button>
</div>
</body>
</html>