• 售前

  • 售后

热门帖子
入门百科

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

[复制链接]
poney 显示全部楼层 发表于 2021-10-26 13:47:45 |阅读模式 打印 上一主题 下一主题
HTML5 的 HTML 语法答应我们在文档内使用 <math>...</math> 标签应用 MathML 元素。
下面是一个使用 MathML 的有用 HTML5 文档:
XML/HTML Code复制内容到剪贴板
       
  • html      
  • <!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>   
这会天生如下效果:

复制代码代码如下:a2 + b2 = c2
便于学习这一概念 - 请使用 FireFox 3.7 或更高版本进行在线练习。
使用 MathML 字符
想象一下,下面是一个使用字符 &InvisibleTimes; 的标记:
XML/HTML Code复制内容到剪贴板
       
  • html      
  • <!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>   
这会天生如下效果

复制代码代码如下:x 2 + 4  x + 4 = 0
便于学习这一概念 - 请使用 FireFox 3.7 或更高版本进行在线练习。
矩阵表达示例
想象一下下面的例子,它会被用来表示一个简单的 2x2 矩阵:
XML/HTML Code复制内容到剪贴板
       
  • html      
  • <!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>   
这会天生如下效果

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

帖子地址: 

回复

使用道具 举报

分享
推广
火星云矿 | 预约S19Pro,享500抵1000!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

草根技术分享(草根吧)是全球知名中文IT技术交流平台,创建于2021年,包含原创博客、精品问答、职业培训、技术社区、资源下载等产品服务,提供原创、优质、完整内容的专业IT技术开发社区。
  • 官方手机版

  • 微信公众号

  • 商务合作