<sup>：上標元素

試一試

<p>
  The <em>Pythagorean theorem</em> is often expressed as the following equation:
</p>

<p>
  <var>a<sup>2</sup></var> + <var>b<sup>2</sup></var> = <var>c<sup>2</sup></var>
</p>

p {
  font:
    1rem "Fira Sans",
    sans-serif;
}

屬性

此元素僅包含全域性屬性。

用法說明

<sup> 元素僅應用於排版目的，即為了符合排版約定或標準而改變文字的位置，而不是僅僅為了呈現或外觀效果。

例如，使用 CSS（最可能是 vertical-align）來為使用較高基線的商業或產品 文字標誌 設定樣式，而不是使用 <sup>。這可以透過設定 `vertical-align: super` 或將基線提高 50% 的 `vertical-align: 50%` 來實現。

<sup> 的適用場景包括（但不限於）:

• 顯示指數，例如“x³”。對於這些情況，尤其是更復雜的情況，可以考慮使用 MathML。請參見下方 示例 中的 指數。
• 顯示 上標字母，在某些語言中用於渲染特定縮寫。例如，在法語中，“mademoiselle”可以縮寫為“M^lle”；這是一個可接受的用法。請參見 上標字母 瞭解示例。
• 表示序數詞，例如用“4^th”代替“fourth”。請參見 序數詞 瞭解示例。

示例

指數

指數，或稱數字的冪，是最常見的上標文字用法之一。例如：

<p>
  One of the most common equations in all of physics is <var>E</var>=<var>m</var
  ><var>c</var><sup>2</sup>.
</p>

結果

上標字母

上標字母在技術上與上標不同。但是，在 HTML 中使用 <sup> 來呈現上標字母是很常見的。上標字母最常見的用途之一是法語中某些縮寫的呈現。

<p>Robert a présenté son rapport à M<sup>lle</sup> Bernard.</p>

結果

序數詞

序數詞，例如英語中的“fourth”或西班牙語中的“quinto”，可以使用數字和以法語渲染的語言特定文字來縮寫。

<p>
  The ordinal number "fifth" can be abbreviated in various languages as follows:
</p>
<ul>
  <li>English: 5<sup>th</sup></li>
  <li>French: 5<sup>ème</sup></li>
</ul>

結果

技術摘要

規範

瀏覽器相容性

另見

• 用於生成下標的 <sub> HTML 元素。請注意，您不能同時使用 `sub` 和 `sup`：您需要使用 MathML 來為元素的化學符號生成上標和下標，分別表示其原子序數和質量數。
• <msub>、<msup> 和 <msubsup> MathML 元素。
• CSS 的 vertical-align 屬性。