老版地址（仅作固定作用）：old.jincong.net
投稿 收藏 标签聚合
首页 > 教程福利 > HTML5 >

在HTML5中使用MathML数学公式的简单讲解

由 金聪采编 分享 时间： 加入收藏 我要投稿 点赞 侵权举报/版权申诉
HTML5的HTML语法允许我们在文档内使用&l;mah&g;...&l;/mah&g;标签应用MahML元素。下面是一个使用MahML的有效HTML5文档：XML/HTMLCode复制内容到剪贴板hml&l;!docypehml&g;&l;hml&g;&l;h......
以下是【金聪采编】分享的内容全文：

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中使用MathML数学公式的简单讲解 ] 仅为会员分享交流，仅供学习、参考使用，请勿用于其他用途，如果想商业使用或者代理，请自行联系版权方获取授权。任何未获取授权的商业使用与本站无关，请自行承担相应责任。
本站不存储任何资源文件，敬请周知！
此资源仅供个人学习、研究使用，禁止非法转播或商业用途，请在获取后24小时内删除，如果你觉得满意，请寻求购买正版或获取授权！
免责申明：本站仅提供学习的平台，所有资料均来自于网络分享线索，版权归原创者所有！本站不提供任何保证，并不承担任何法律责任，如果对您的版权或者利益造成损害，请提供相应的资质证明，我们将于3个工作日内予以处理。版权申诉相关说明
本网站采用 BY-NC-SA 协议进行授权 转载请注明原文链接:在HTML5中使用MathML数学公式的简单讲解

上一篇：解析HTML5的存储功能和web SQL的相关操作方法

下一篇：使用HTML5进行SVG矢量图形绘制的入门教程

相关推荐文档

精选图文

热门排序

推荐文章

HTML5几个设计和修改的页面范例分享 HTML5几个设计和修改的页面范例分享
HTML5
逼真的HTML5树叶飘落动画 使用canvas绘制贝塞尔曲线 用HTML5 实现橡皮擦的涂抹效果的教程 HTML5未来发展趋势 HTML5有哪些新特征 五个2015 年最佳HTML5 框架 基于HTML5的齿轮动画特效 详解HTML5中ol标签的用法 HTML5 Canvas绘制圆点虚线实例 html5+svg学习指南之SVG基础知识

热门标签

整站源码 php源码 编程教程 视频教程 游戏源码 管理系统 手游源码 cms模板 网站模板 企业模板 微信平台 素材资源 小程序 微信小程序 pbootcms 优惠信息 福利教程 商城金融
221381
向你推荐的相关文章

相关文章列表

领取福利

微信扫码领取福利

微信扫码分享