<semantics>
Baseline
Widely available
*
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2023.
* Some parts of this feature may have varying levels of support.
The <semantics> MathML element associates annotations with a MathML expression, for example its text source as a lightweight markup language or mathematical meaning expressed in a special XML dialect. Typically, its structure is:
- a first child which is a MathML expression to be annotated.
- subsequent
<annotation>or<annotation-xml>elements, the latter being reserved for XML formats such as Content MathML or SVG.
By default, only the first child of the <semantics> element is rendered while the others have their display set to none.
semantics > :not(:first-child) {
display: none;
}
Note: Legacy MathML specifications allowed renderers to decide the default rendering according to available annotations. The following rules for determining the visible child have been implemented in some browsers. See MathML 4 for the distinction between Presentation and Content MathML.
- If no other rules apply: By default only the first child is rendered, which is supposed to be Presentation MathML.
- If the first child is a Presentation MathML element other than
<annotation>or<annotation-xml>, render the first child. - If no Presentation MathML is found, render the first
<annotation>or<annotation-xml>child element of<semantics>without asrcattribute. For<annotation-xml>elements theencodingattribute must be equal to one of following values:"application/mathml-presentation+xml""MathML-Presentation""SVG1.1""text/html""image/svg+xml""application/xml"
Note that "application/mathml+xml" is not mentioned here as it does not distinguish between Content or Presentation MathML.
Attributes
This element's attributes include the global MathML attributes.
Example
<math display="block">
<semantics>
<!-- The first child is the MathML expression rendered by default. -->
<mrow>
<msup>
<mi>x</mi>
<mn>2</mn>
</msup>
<mo>+</mo>
<mi>y</mi>
</mrow>
<!--
Annotate with content MathML, a dedicated XML dialect
to express the meaning of mathematical formulas.
-->
<annotation-xml encoding="application/mathml-content+xml">
<apply>
<plus />
<apply>
<power />
<ci>x</ci>
<cn type="integer">2</cn>
</apply>
<ci>y</ci>
</apply>
</annotation-xml>
<!--
Annotate with LaTeX, a lightweight markup language
to write mathematical formulas.
-->
<annotation encoding="application/x-tex">x^{2} + y</annotation>
</semantics>
</math>
Technical summary
| Implicit ARIA role | None |
|---|
Specifications
| Specification |
|---|
| MathML Core # semantics-and-presentation |
Browser compatibility
| desktop | mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
semantics
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Use the algorithm described on MDN to determine the visible child.
|
|
|
|
|
|
|
|
|
|
|
|
|
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
- No support
- No support
- Non-standard. Check cross-browser support before using.
- Deprecated. Not for use in new websites.