工作学习日(第一周)[3day]---H5的MathML

2023-10-25 14:10

本文主要是介绍工作学习日(第一周)[3day]---H5的MathML,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

前两天周六加班,周天当了一天躺尸,工作之后,果然,日常加班。。。。我还是个孩子。。。

1.什么是MathML?

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

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

2.部分MathML 元素如下:

<mstyle>.........</mstyle>   用于设置其包裹的最终表达式的样式。

如:<mstyle  displaystyle="true"  color="#ff0000"   fontsize="14px"    fontfamily="arial">......</mstyle>

<mrow>......</mrow>   用于包裹一个或多个表达式(可省略)。

<msup>......</msup>  用于包裹上标的表达式(如:指数函数)。

<msub>......</msub>  用于包裹下表的表达式。

<mi>.........</mi>      用于包裹字符。

<mn>.........</mn>      用于包裹数字。

<mo>...........</mo>          用于包裹各种运算符号(+,-,<mo></mo>,<mfrac></mfrac>,<,>,(,)等)

<msqrt>..........</msqrt>   用于开根号。

<mfenced open="[" close="]">.........</mfenced>   用于包裹矩阵即先定义外围的括号。

<mtable>..........</mtable>    类似table。

<mtr>..........</mtr>      代表矩阵的行。

<mtd>.........</mtd>      代表每行的每一个值。

3.实例

(1)

  1. <math xmlns="http://www.w3.org/1998/Math/MathML">  
  2.       <mrow>  
  3.         <msup><mi>a</mi><mn>2</mn></msup>  
  4.         <mo>+</mo>  
  5.         <msup><mi>b</mi><mn>2</mn></msup>  
  6.         <mo>=</mo>  
  7.         <msup><mi>c</mi><mn>2</mn></msup>  
  8.       </mrow>  
  9.     </math>  
网页显示结果: a2(a的平方)+b2(b的平方)=c2(c的平方);

(2)

  1. <math xmlns="http://www.w3.org/1998/Math/MathML">  
  2.        <mrow>  
  3.           <mrow>  
  4.              <msup>  
  5.                 <mi>x</mi>  
  6.                 <mn>2</mn>  
  7.              </msup>  
  8.              <mo>+</mo>  
  9.              <mrow>  
  10.                 <mn>4</mn>  
  11.                 <mo></mo>  
  12.                 <mi>x</mi>  
  13.              </mrow>  
  14.              <mo>+</mo>  
  15.              <mn>4</mn>  
  16.           </mrow>  
  17.              <mo>=</mo>  
  18.              <mn>0</mn>  
  19.         </mrow>  
  20.    </math>  
网页显示结果: x2(x的平方)+4x+4=0;

(3)

  1. <math xmlns="http://www.w3.org/1998/Math/MathML">  
  2.        <mrow>  
  3.           <mi>A</mi>  
  4.           <mo>=</mo>  
  5.           <mfenced open="[" close="]">  
  6.              <mtable>  
  7.                 <mtr>  
  8.                    <mtd><mi>x</mi></mtd>  
  9.                    <mtd><mi>y</mi></mtd>  
  10.                 </mtr>  
  11.                 <mtr>  
  12.                    <mtd><mi>z</mi></mtd>  
  13.                    <mtd><mi>w</mi></mtd>  
  14.                 </mtr>  
  15.              </mtable>  
  16.          </mfenced>  
  17.       </mrow>  
  18.    </math>  
网页显示结果如下:

2016219113648268.jpg (86×68)

这篇关于工作学习日(第一周)[3day]---H5的MathML的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/283107

相关文章

SpringBoot集成LiteFlow工作流引擎的完整指南

《SpringBoot集成LiteFlow工作流引擎的完整指南》LiteFlow作为一款国产轻量级规则引擎/流程引擎,以其零学习成本、高可扩展性和极致性能成为微服务架构下的理想选择,本文将详细讲解Sp... 目录一、LiteFlow核心优势二、SpringBoot集成实战三、高级特性应用1. 异步并行执行2

Spring @Scheduled注解及工作原理

《Spring@Scheduled注解及工作原理》Spring的@Scheduled注解用于标记定时任务,无需额外库,需配置@EnableScheduling,设置fixedRate、fixedDe... 目录1.@Scheduled注解定义2.配置 @Scheduled2.1 开启定时任务支持2.2 创建

SpringBoot整合Flowable实现工作流的详细流程

《SpringBoot整合Flowable实现工作流的详细流程》Flowable是一个使用Java编写的轻量级业务流程引擎,Flowable流程引擎可用于部署BPMN2.0流程定义,创建这些流程定义的... 目录1、流程引擎介绍2、创建项目3、画流程图4、开发接口4.1 Java 类梳理4.2 查看流程图4

LiteFlow轻量级工作流引擎使用示例详解

《LiteFlow轻量级工作流引擎使用示例详解》:本文主要介绍LiteFlow是一个灵活、简洁且轻量的工作流引擎,适合用于中小型项目和微服务架构中的流程编排,本文给大家介绍LiteFlow轻量级工... 目录1. LiteFlow 主要特点2. 工作流定义方式3. LiteFlow 流程示例4. LiteF

SpringBoot集成LiteFlow实现轻量级工作流引擎的详细过程

《SpringBoot集成LiteFlow实现轻量级工作流引擎的详细过程》LiteFlow是一款专注于逻辑驱动流程编排的轻量级框架,它以组件化方式快速构建和执行业务流程,有效解耦复杂业务逻辑,下面给大... 目录一、基础概念1.1 组件(Component)1.2 规则(Rule)1.3 上下文(Conte

Go学习记录之runtime包深入解析

《Go学习记录之runtime包深入解析》Go语言runtime包管理运行时环境,涵盖goroutine调度、内存分配、垃圾回收、类型信息等核心功能,:本文主要介绍Go学习记录之runtime包的... 目录前言:一、runtime包内容学习1、作用:① Goroutine和并发控制:② 垃圾回收:③ 栈和

详解如何使用Python构建从数据到文档的自动化工作流

《详解如何使用Python构建从数据到文档的自动化工作流》这篇文章将通过真实工作场景拆解,为大家展示如何用Python构建自动化工作流,让工具代替人力完成这些数字苦力活,感兴趣的小伙伴可以跟随小编一起... 目录一、Excel处理:从数据搬运工到智能分析师二、PDF处理:文档工厂的智能生产线三、邮件自动化:

Android学习总结之Java和kotlin区别超详细分析

《Android学习总结之Java和kotlin区别超详细分析》Java和Kotlin都是用于Android开发的编程语言,它们各自具有独特的特点和优势,:本文主要介绍Android学习总结之Ja... 目录一、空安全机制真题 1:Kotlin 如何解决 Java 的 NullPointerExceptio

基于Python开发一个有趣的工作时长计算器

《基于Python开发一个有趣的工作时长计算器》随着远程办公和弹性工作制的兴起,个人及团队对于工作时长的准确统计需求日益增长,本文将使用Python和PyQt5打造一个工作时长计算器,感兴趣的小伙伴可... 目录概述功能介绍界面展示php软件使用步骤说明代码详解1.窗口初始化与布局2.工作时长计算核心逻辑3

RabbitMQ工作模式中的RPC通信模式详解

《RabbitMQ工作模式中的RPC通信模式详解》在RabbitMQ中,RPC模式通过消息队列实现远程调用功能,这篇文章给大家介绍RabbitMQ工作模式之RPC通信模式,感兴趣的朋友一起看看吧... 目录RPC通信模式概述工作流程代码案例引入依赖常量类编写客户端代码编写服务端代码RPC通信模式概述在R