Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

math-depth CSS property

Baseline 2026
Neu verfügbar

Seit March 2026 funktioniert diese Funktion auf aktuellen Geräten und in aktuellen Browserversionen. Auf älteren Geräten oder in älteren Browsern funktioniert sie möglicherweise nicht.

Die math-depth-Eigenschaft beschreibt einen Begriff der Tiefe für jedes Element einer mathematischen Formel in Bezug auf den obersten Container dieser Formel. Dies wird verwendet, um den berechneten Wert der Schriftgröße von Elementen zu skalieren, wenn font-size: math angewendet wird.

Hinweis: font-size: math ist die Standardeinstellung für <math>-Elemente im MathML Core User Agent-Stylesheet, daher ist es nicht notwendig, es explizit anzugeben.

Syntax

css
/* Keyword values */
math-depth: auto-add;

/* Relative values */
math-depth: add(2);
math-depth: add(-2);

/* Absolute value */
math-depth: 4;

/* Global values */
math-depth: inherit;
math-depth: initial;
math-depth: revert;
math-depth: revert-layer;
math-depth: unset;

Werte

auto-add

Wird auf die geerbte math-depth plus 1 gesetzt, wenn der geerbte math-style compact ist.

add(<integer>)

Wird auf die geerbte math-depth plus der angegebenen Ganzzahl gesetzt.

<integer>

Wird auf die angegebene Ganzzahl gesetzt.

Formale Definition

Anfangswert0
Anwendbar aufalle Elemente
VererbtJa
Berechneter Wertwie angegeben
AnimationstypNot animatable

Formale Syntax

math-depth = 
auto-add |
add( <integer> ) |
<integer>

<integer> =
<number-token>

Beispiele

Festlegung einer mathematischen Tiefe

Das folgende Beispiel zeigt die Auswirkung der Änderung der Eigenschaft math-depth auf die Schriftgröße von Unterformeln. Die Zahlen in jeder Unterformel geben die math-depth und den angewandten Skalierungsfaktor an.

Das erste <mtext>-Element wird als Referenz für andere Unterformeln verwendet und hat keine spezifischen Stile angewendet. Die zweite und dritte Unterformeln haben math-depth auf auto-add gesetzt und zeigen die Skalierungseffekte in Abhängigkeit vom math-style.

Die letzten beiden Unterformeln zeigen die Auswirkung der Einstellung von math-depth auf einen bestimmten Wert.

HTML

html
<p>
  <math>
    <mtext>0</mtext>

    <!-- auto-add value has no effect when math-style is normal -->
    <mrow style="math-style: normal">
      <mrow style="math-depth: auto-add">
        <mtext>0</mtext>
      </mrow>
    </mrow>

    <!-- the inherited math-style is compact, so math-depth is set to 1 -->
    <mrow style="math-depth: auto-add">
      <mtext>1</mtext>
    </mrow>

    <mrow style="math-depth: add(2)">
      <mtext>2</mtext>
      <mrow style="math-depth: add(-1)">
        <mtext>1</mtext>
      </mrow>
      <mrow style="math-depth: 0">
        <mtext>0</mtext>
      </mrow>
    </mrow>
  </math>
</p>

Ergebnis

Spezifikationen

Spezifikation
MathML Core
# the-math-script-level-property

Browser-Kompatibilität

Siehe auch