極客書

HTML5 - MathML

HTML5的HTML語法允許在文檔中使用<math>…</math>標記使用MathML元素。

大多數web瀏覽器都可以顯示MathML標記。如果您的瀏覽器不支持MathML，那麼我建議您使用最新版本的Firefox。

MathML Examples

下面是一個帶有MathML−的有效HTML5文檔;

Live Demo 
<!doctype html>

<html>
   <head>
      <meta charset = "UTF-8">
      <title>Pythagorean theorem</title>
   </head>
	
   <body>
      <math xmlns = "http://www.w3.org/1998/Math/MathML">
		
         <mrow>
            <msup><mi>a</mi><mn>2</mn></msup>
            <mo>+</mo>
				
            <msup><mi>b</mi><mn>2</mn></msup>
            <mo> = </mo>
				
            <msup><mi>c</mi><mn>2</mn></msup>
         </mrow>
			
      </math>
   </body>
</html>

這將產生以下結果&負;

Using MathML Characters

考慮一下，下面是使用字符&InvisibleTimes;−的標記;

Live Demo 
<!doctype html>

<html>
   <head>
      <meta charset = "UTF-8">
      <title>MathML Examples</title>
   </head>
	
   <body>
      <math xmlns = "http://www.w3.org/1998/Math/MathML">
		
         <mrow>			
            <mrow>
				
               <msup>
                  <mi>x</mi>
                  <mn>2</mn>
               </msup>
					
               <mo>+</mo>
					
               <mrow>
                  <mn>4</mn>
                  <mo>⁢</mo>
                  <mi>x</mi>
               </mrow>
					
               <mo>+</mo>
               <mn>4</mn>
					
            </mrow>
				
            <mo>=</mo>
            <mn>0</mn>
				 
         </mrow>
      </math>
   </body>
</html>

這將產生以下結果。如果你不能看到正確的結果，比如x2+4x+4=0，那麼使用Firefox 3.5或更高版本。

這將產生以下結果&負;

Matrix Presentation Examples

考慮下面的示例，該示例將用於表示一個簡單的2x2矩陣−

Live Demo 
<!doctype html>

<html>
   <head>
      <meta charset = "UTF-8">
      <title>MathML Examples</title>
   </head>
	
   <body>
      <math xmlns = "http://www.w3.org/1998/Math/MathML">
		
         <mrow>
            <mi>A</mi>
            <mo>=</mo>
			
            <mfenced open = "[" close="]">
			
               <mtable>
                  <mtr>
                     <mtd><mi>x</mi></mtd>
                     <mtd><mi>y</mi></mtd>
                  </mtr>
					
                  <mtr>
                     <mtd><mi>z</mi></mtd>
                     <mtd><mi>w</mi></mtd>
                  </mtr>
               </mtable>
               
            </mfenced>
         </mrow>
      </math>

   </body>
</html>

這將產生以下結果&負;

這將產生以下結果。如果你看不到正確的結果，那麼使用Firefox3.5或更高版本。