--- title: slug: Web/MathML/Element/math tags: - MathML - MathML Reference - 'MathML:Element' translation_of: Web/MathML/Element/math ---
{{MathMLRef}}

MathML的顶级元素是<math>。所有有效的MathML实例必须被包括在 <math> 标记中。另外不可以在一个 <math> 元素中嵌套第二个 <math> 元素，但是 <math> 元素中可以有任意多的子元素 。

属性

除了以下提到的属性， <math> 元素接受所有 {{ MathMLElement("mstyle") }} 元素的属性。

class, id, style
用于配合样式表使用。
dir
公式的整体方向。取值可以是 ltr (从左到右) 或者 rtl (从右到左).
href
用于给公式设置一个超链接的URI。
mathbackground
背景颜色。你可以使用#rgb格式、 #rrggbb 格式和 HTML颜色名。
mathcolor
公式的文本颜色。你可以使用#rgb格式、 #rrggbb 格式和 HTML颜色名。
display
这个枚举属性指定本标记所括的MathML代码应该如何被显示。该属性有如下取值：

如果没有指定该属性值，默认值采用 inline。

mod {{deprecated_inline}}
因为display属性的出现而废弃。
可用取值为：display (效果和display="block"一样) 和and inline.
overflow
指定当该数学公式超过了其运行的范围时应该如何表现。
可能的取值为： linebreak (默认值), scroll, elide, truncate, scale.

范例

Theorem of Pythagoras

HTML5 记号

<!DOCTYPE html>
<html>
  <head>
    <title>MathML in HTML5</title>
  </head>
  <body>

  <math>
    <mrow>
      <mrow>
        <msup>
          <mi>a</mi>
          <mn>2</mn>
        </msup>
        <mo>+</mo>
        <msup>
          <mi>b</mi>
          <mn>2</mn>
        </msup>
      </mrow>
      <mo>=</mo>
      <msup>
        <mi>c</mi>
        <mn>2</mn>
      </msup>
    </mrow>
  </math>

  </body>
</html>

XHTML 记号

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" "http://www.w3.org/Math/DTD/mathml2/xhtml-math11-f.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title>MathML in XHTML</title>
</head>
<body>

  <math xmlns="http://www.w3.org/1998/Math/MathML">
    <mrow>
      <mrow>
        <msup>
          <mi>a</mi>
          <mn>2</mn>
        </msup>
        <mo>+</mo>
        <msup>
          <mi>b</mi>
          <mn>2</mn>
        </msup>
      </mrow>
      <mo>=</mo>
      <msup>
        <mi>c</mi>
        <mn>2</mn>
      </msup>
    </mrow>
  </math>

</body>
</html>

注意： XHTML 文档如果带有MathML，必须将文档的MIME类型设置为application/xhtml+xml进行发送。一般来说可以通过将扩展名改为.xhtml 来实现对本地文件的修改。对于Apache服务器，你可以配置.htaccess文件 来达到映射扩展名为正确的MIME类型的目的。因为MathML被放在一个XML文件中，你必须编写一个严格符合XML格式的文档。

规范

规范 状态 注释
{{ SpecName('MathML3', 'chapter2.html#interf.toplevel', 'The Top-Level math Element') }} {{ Spec2('MathML3') }} 当前的规范
{{ SpecName('MathML2', 'chapter7.html#interf.toplevel', 'The Top-Level math Element') }} {{ Spec2('MathML2') }} 最初的规范

浏览器兼容性

{{CompatibilityTable}}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
XHTML标记 {{CompatNo}} {{ CompatGeckoDesktop("1.0") }} {{CompatNo}} 9.5 5.1
HTML5标记 {{CompatNo}} {{ CompatGeckoDesktop("2.0") }} {{CompatNo}} {{CompatNo}} 5.1
dir {{CompatNo}} {{ CompatGeckoDesktop("12.0") }} {{CompatNo}} {{CompatNo}} {{CompatNo}}
href {{CompatNo}} {{ CompatGeckoDesktop("7.0") }} {{CompatNo}} {{CompatNo}} {{CompatNo}} [1]
mathbackground {{CompatNo}} {{ CompatGeckoDesktop("2.0") }} {{CompatNo}} {{CompatNo}} 5.1
mathcolor {{CompatNo}} {{ CompatGeckoDesktop("2.0") }} {{CompatNo}} {{CompatNo}} 5.1
overflow {{CompatNo}} {{CompatNo}} {{CompatNo}} {{CompatNo}} {{CompatNo}}
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
XHTML 标记 {{CompatNo}} {{CompatNo}} {{ CompatGeckoMobile("1.0") }} {{CompatNo}} {{CompatNo}} {{CompatNo}}
HTML5 标记 {{CompatNo}} {{CompatNo}} {{ CompatGeckoMobile("2.0") }} {{CompatNo}} {{CompatNo}} {{CompatNo}}
dir {{CompatNo}} {{CompatNo}} {{ CompatGeckoMobile("12.0") }} {{CompatNo}} {{CompatNo}} {{CompatNo}}
href {{CompatNo}} {{CompatNo}} {{ CompatGeckoMobile("7.0") }} {{CompatNo}} {{CompatNo}} {{CompatNo}} [1]
mathbackground {{CompatNo}} {{CompatNo}} {{ CompatGeckoMobile("2.0") }} {{CompatNo}} {{CompatNo}} {{CompatNo}}
mathcolor {{CompatNo}} {{CompatNo}} {{ CompatGeckoMobile("2.0") }} {{CompatNo}} {{CompatNo}} {{CompatNo}}
overflow {{CompatNo}} {{CompatNo}} {{CompatNo}} {{CompatNo}} {{CompatNo}} {{CompatNo}}

[1] See bug 85733.

Gecko-specific 注释

Gecko 7.0 {{ geckoRelease("7.0") }} 添加了对所有MathML属性在顶级math元素上的支持。 (也就是说和添加一个{{ MathMLElement("mstyle") }}元素效果一样)。然而，displaystyle 属性直到Gecko 8.0 {{ geckoRelease("8.0") }} 才 被添加进实现。

纯文本的fall-back (alttext) 或者指定替代图像的属性altimg, altimg-width, altimg-height 或 altimg-valign 目前都还没有在Gecko中实现。

另见