<semantics>

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 a src attribute. For <annotation-xml> elements the encoding attribute 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.

html,
body {
 height: 100%;
}
body {
 display: grid;
 place-items: center;
 font-size: 1.5rem;
}

<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>

Help improve MDN

This page was last modified on ⁨Mar 13, 2025⁩ by MDN contributors.