math-depth

可用性有限

此特性不是基線特性，因為它在一些最廣泛使用的瀏覽器中不起作用。

math-depth 屬性描述了數學公式中每個元素相對於該公式頂層容器的“深度”概念。當應用 font-size: math 時，它用於縮放元素的 font-size 的計算值。

注意：在 MathML Core 使用者代理樣式表中，font-size: math 是 <math> 元素的預設值，因此無需明確指定。

語法

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;

值

auto-add: 當繼承的 math-style 為 compact 時，設定為繼承的 math-depth 加 1。
add(<integer>): 設定為繼承的 math-depth 加指定的整數。
<integer>: 設定為指定的整數。

正式定義

初始值	`0`
應用於	所有元素
繼承性	是
計算值	同指定值
動畫型別	不可動畫化

正式語法

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

示例

指定數學深度

以下示例顯示了更改 math-depth 屬性對子公式字型大小的影響。每個子公式中的數字表示應用的 math-depth 和縮放因子。

第一個 <mtext> 元素用作其他子公式的參考，沒有應用特定的樣式。第二個和第三個子公式將 math-depth 設定為 auto-add，並顯示根據 math-style 進行縮放的效果。

最後兩個子公式顯示了將 math-depth 設定為特定值的效果。

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>

p {
  font-size: 3rem;
  margin: 1rem 0;
}

結果

規範

規範
MathML Core # the-math-script-level-property

瀏覽器相容性

另見

幫助改進 MDN

瞭解如何貢獻

本頁面最後修改於 2025 年 7 月 14 日，由 MDN 貢獻者完成。

在 GitHub 上檢視此頁面 • 報告此內容的問題