DIV CSS 佈局教程網

設為首頁 加入收藏
 DIV+CSS佈局教程網 >> 網頁腳本 >> HTML基礎知識 >> HTML5詳解 >> 在HTML5中使用MathML數學公式的簡單講解
在HTML5中使用MathML數學公式的簡單講解
編輯：HTML5詳解     

Html5 的 Html 語法允許我們在文檔內使用 <math>...</math> 標簽應用 MathML 元素。

下面是一個使用 MathML 的有效 Html5 文檔：

XML/Html Code復制內容到剪貼板
  1. Html   
  2. <!doctype Html>  
  3.   <Html>  
  4.   <head>  
  5.   <meta charset="UTF-8">  
  6.   <title>Pythagorean theorem</title>  
  7.   </head>  
  8.   <body>  
  9.     <math XMLns="http://www.w3.org/1998/Math/MathML">  
  10.       <mrow>  
  11.         <msup><mi>a</mi><mn>2</mn></msup>  
  12.         <mo>+</mo>  
  13.         <msup><mi>b</mi><mn>2</mn></msup>  
  14.         <mo>=</mo>  
  15.         <msup><mi>c</mi><mn>2</mn></msup>  
  16.       </mrow>  
  17.     </math>  
  18.   </body>  
  19. </Html>    

這會生成如下結果：


復制代碼代碼如下: a2 + b2 = c2
便於學習這一概念 - 請使用 Firefox 3.7 或更高版本進行在線練習。

使用 MathML 字符
想象一下，下面是一個使用字符 &InvisibleTimes; 的標記：

XML/Html Code復制內容到剪貼板
  1. Html   
  2. <!doctype Html>  
  3.   <Html>  
  4.   <head>  
  5.   <meta charset="UTF-8">  
  6.   <title>MathML Examples</title>  
  7.   </head>  
  8.   <body>  
  9.     <math XMLns="http://www.w3.org/1998/Math/MathML">  
  10.        <mrow>  
  11.           <mrow>  
  12.              <msup>  
  13.                 <mi>x</mi>  
  14.                 <mn>2</mn>  
  15.              </msup>  
  16.              <mo>+</mo>  
  17.              <mrow>  
  18.                 <mn>4</mn>  
  19.                 <mo>⁢</mo>  
  20.                 <mi>x</mi>  
  21.              </mrow>  
  22.              <mo>+</mo>  
  23.              <mn>4</mn>  
  24.           </mrow>  
  25.              <mo>=</mo>  
  26.              <mn>0</mn>  
  27.         </mrow>  
  28.    </math>  
  29. </body>  
  30. </Html>   

這會生成如下結果


復制代碼代碼如下: x 2 + 4 x + 4 = 0
便於學習這一概念 - 請使用 Firefox 3.7 或更高版本進行在線練習。

矩陣表達示例
想象一下下面的例子，它會被用來表示一個簡單的 2x2 矩陣：

XML/Html Code復制內容到剪貼板
  1. Html   
  2. <!doctype Html>  
  3.   <Html>  
  4.   <head>  
  5.   <meta charset="UTF-8">  
  6.   <title>MathML Examples</title>  
  7.   </head>  
  8.   <body>  
  9.     <math XMLns="http://www.w3.org/1998/Math/MathML">  
  10.        <mrow>  
  11.           <mi>A</mi>  
  12.           <mo>=</mo>  
  13.           <mfenced open="[" close="]">  
  14.              <mtable>  
  15.                 <mtr>  
  16.                    <mtd><mi>x</mi></mtd>  
  17.                    <mtd><mi>y</mi></mtd>  
  18.                 </mtr>  
  19.                 <mtr>  
  20.                    <mtd><mi>z</mi></mtd>  
  21.                    <mtd><mi>w</mi></mtd>  
  22.                 </mtr>  
  23.              </mtable>  
  24.          </mfenced>  
  25.       </mrow>  
  26.    </math>  
  27. </body>  
  28. </Html>   

這會生成如下結果
2016219113648268.jpg (86×68)

HTML5詳解
HTML5 Canvas 超炫酷煙花綻放動畫教程
這是一個很酷的Html5 Canvas動畫，它將模擬的是我們現實生活中煙花綻放的動畫特效，效果非常
Mugeda HTML5富媒體平台簡介
摘要：Mugeda提供基於雲的平台，供開發人員和設計人員快速的開發、發布和統計基於Html5的，包
遮罩的使用
在時間線上，我們先加入一個圖片，如圖：然後新建一層，並點擊在上面畫一個圖形，在時間線上點擊“轉為遮

相關文章

HTML入門知識HTML5教程關於HTMLHTML和XhtmlHTML5特效代碼HTML5詳解
小編推薦
html5 viewport使用方法示例詳解 10個為設計者准備的HTML5在線工具 分享全球十款超強HTML5開發工具 通過Canvas及File API縮放並上傳圖片完整示例 歷時三年 W3C宣布HTML5規范正式定稿 Html5游戲開發之乒乓Ping Pong游戲示例(一) html5 canvas RPG游戲效率探索. HTML5上傳文件顯示進度的實現代碼 canvas應用 HTML5 Canvas――用路徑描畫線條實例介紹
熱門推薦
10個為設計者准備的HTML5在線工具 6個實用的HTML5本地存儲(Local Storage)教程 用HTML5制作數字時鐘的教程 html5 Canvas畫圖教程(7)—canvas裡畫曲線之quadraticCurveTo方法 十個使用HTML5開發的精彩應用 HTML5離線緩存在tomcat下部署可實現圖片flash等離線浏覽 Chrome+HTML5 ，實現一秒鐘啟動Gmail 初學HTML5請放下包袱,它很容易！ html5 實現動畫（二）
大家都在看
JavaScript插件化開發教程（六） html5 簡述 javascript實現一個簡單的彈出窗 分享20款美化網站的 jQuery Lightbox 燈箱插件 js實現Form欄顯示全格式時間時鐘效果代碼 css 串聯選擇器和後代選擇器介紹及示例 js+canvas繪制矩形的方法 jQuery.fn解釋
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved