ylbtech-HTML5: HTML5 MathML
1.返回顶部
1、

HTML5 MathML

HTML5 可以在文档中使用 MathML 元素，对应的标签是 <math>...</math> 。

MathML 是数学标记语言，是一种基于XML（标准通用标记语言的子集）的标准，用来在互联网上书写数学符号和公式的置标语言。

注意：大部分浏览器都支持 MathML 标签，如果你的浏览器不支持该标签，可以使用最新版的 Firefox 或 Safari 浏览器查看。

MathML 实例

以下是一个简单的 MathML 实例：

<!DOCTYPE html>

<html>

   <head>

      <meta charset="UTF-8">

      <title>菜鸟教程(runoob.com)</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>

尝试一下 »

运行结果图，如下所示：

以下实例添加了一些运算符：

<!DOCTYPE html>

<html>

   <head>

      <meta charset="UTF-8">

      <title>菜鸟教程(runoob.com)</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>

尝试一下 »

运行结果图，如下所示：

以下实例是一个 2×2 矩阵，可以在 Firefox 3.5 以上版本查看到效果：

<!DOCTYPE html>

<html>

   <head>

      <meta charset="UTF-8">

      <title>菜鸟教程(runoob.com)</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>

尝试一下 »

运行结果图，如下所示：

2、
2.返回顶部
 
3.返回顶部
 
4.返回顶部
 
5.返回顶部
1、
2、
 
6.返回顶部
 
作者：ylbtech
出处：http://ylbtech.cnblogs.com/
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。

HTML5: HTML5 MathML的更多相关文章

  1. html-5 --html5教程article、footer、header、nav、section使用

    header header元素是一种具有引导和导航作用的辅助元素.通常,header元素可以包含一个区块的标题(如h1至h6,或者hgroup元素标签),但也可以包含其他内容,例如数据表格.搜索表单或 ...

  2. [Html5] HTML5 开发手机应用

    上次周例会我给大家做了题目为:<漫游移动平台前端开发>的汇报,现在推荐一些额外的学习资料.          依照目前iPhone/Android 迅速提升市占率的情势来看,未来如果想要在 ...

  3. [html5]HTML5中<section>和<article>的区别

    一.section元素 从字面理解就是区块.部分的意思,相对于article元素更加广泛,每个区块都可以使用,比如页面里的导航菜单.文章正文.文章的评论等. 1.section元素用于对网站或应用程序 ...

  4. WEB前端之HTML5~HTML5与HTML4的区别

    推出的理由及目标 WEB浏览器存在的问题包括以下三点 世界知名浏览器厂商对HTML5的支持 语法的改变 DOCTYPE的声明 XHTML的DOCTYPE声明方式 HTML4的DOCTYPE声明方式 H ...

  5. HTML5: HTML5 Geolocation（地理定位）

    ylbtech-HTML5: HTML5 Geolocation(地理定位) 1.返回顶部 1. HTML5 Geolocation(地理定位) HTML5 Geolocation(地理定位)用于定位 ...

  6. HTML5: HTML5 拖放

    ylbtech-HTML5: HTML5 拖放 1.返回顶部 1. HTML5 拖放(Drag 和 Drop) 拖放(Drag 和 drop)是 HTML5 标准的组成部分.   将 RUNOOB.C ...

  7. HTML5: HTML5 内联 SVG

    ylbtech-HTML5: HTML5 内联 SVG 1.返回顶部 1. HTML5 内联 SVG HTML5 支持内联 SVG. 什么是SVG? SVG 指可伸缩矢量图形 (Scalable Ve ...

  8. HTML5: HTML5 Canvas

    ylbtech-HTML5: HTML5 Canvas 1.返回顶部 1. HTML5 Canvas <canvas> 标签定义图形,比如图表和其他图像,您必须使用脚本来绘制图形. 在画布 ...

  9. HTML5: HTML5 新元素

    ylbtech-HTML5: HTML5 新元素 1.返回顶部 1. HTML5 新元素 自1999年以后HTML 4.01 已经改变了很多,今天,在HTML 4.01中的几个已经被废弃,这些元素在H ...

随机推荐

  1. POI 讀取EXCEL

    /*** 獲取單元格數值* * @param cell* @return*/private String getCellValue(Cell cell) {String cellValue = &qu ...

  2. MultipartFile 图片上传到Linux服务器Tomcat下的webapps目录

    第一次接触 linux 服务器,做图片上传的时候遇到了些坑,搞了些天总算成功了,记录一下 /** * 上传图片 * * @param request * @param file * @return * ...

  3. select下拉框选中其中一个值

    function LoadList123() { var param = { action: "SelectShopType1"};//参数拼接 var Resultstr = & ...

  4. Uncaught (in promise) DOMException谷歌浏览器js报错分析

    Chrome的自动播放的政策在2018年4月做了更改,这点在开源中国的这篇文章中也有说到. 新的行为:浏览器为了提高用户体验,减少数据消耗,现在都在遵循autoplay政策,Chrome的autopl ...

  5. 解决Ubuntu与Windows双系统时间不同步问题

    目录 1.Windows修改法 1.1设置UTC 1.2恢复LocalTime 2.Ubuntu修改法 2.1设置LocalTime 2.2恢复UTC 切换系统后,往往发现时间差了8小时.这恰恰是北京 ...

  6. 分别用switch语句和if语句实现键盘录入月份，输出对应的季节

    switch建议判断固定值的时候用 if建议判断区间或范围的时候用 1.用switch实现键盘录入月份,输出对应的季节 import java.util.Scanner; class Hello2 { ...

  7. jumpserver4.0centos7安装步骤

    一步一步安装(CentOS) 测试推荐环境 CPU: 64位双核处理器 内存: 4G DDR3 数据库:mysql 版本大于等于 5.6 mariadb 版本大于等于 5.5.6 环境 系统: Cen ...

  8. redis缓存架构-02-两种持久化机制(RDB和AOF)

    1.两种持久化机制的介绍 1.1 RDB 周期性的生成redis内存数据的一份完整的快照 1)根据配置的检查点,生产rdb快照文件,fork一个子线程,将数据dump到rdb快照文件中,完成rdb文件 ...

  9. Php 十六进制短浮点数转十进制，带符号位

    /** * 十六进制浮点型转为十进制 * @param String $strHex 十六进制浮点数 * @return 十进制 */ public static function hexToDecF ...

  10. ubuntu16.04安装LNMP（ubuntu+Nginx+mysql+PHP7.0）

    系统环境: Ubuntu 16.04.2 LTS nginx version: nginx/1.10.3 (Ubuntu) PHP 7.0.22-0ubuntu0.16.04.1 mysql  Ver ...