sup 要素

編集

<sup> 要素は、HTMLにおいてテキストを上付き文字として表示するために使用されます。通常、数式や化学式、脚註など、上付き文字が必要な場面で用いられます。<sup> 要素で囲まれたテキストは、標準の行の上に少し浮かぶように表示されます。

定義

編集

<sup> 要素は、上付き文字を表現するために使用されます。テキストの書式設定の一環として、数字や文字を通常のテキストよりも高い位置に配置することができます。これにより、数式、化学式、引用文献の参照など、特定の表現方法を視覚的に示すことができます。

使用方法

編集

<sup> 要素は、上付き文字として表示したいテキストをその内部に挿入します。以下に基本的な構文を示します。

<p>この式は <sup>2</sup> x と表示されます。</p>

上記のコードでは、数字の「2」が上付き文字として表示されます。

数学的な表現

編集

数式における累乗の表現では、<sup> 要素を使用して指数を上付き文字として表示できます。

<p>x<sup>2</sup> + y<sup>2</sup> = z<sup>2</sup></p>

このコードは、ピタゴラスの定理を示す式 x² + y² = z² を上付き文字を使って表現しています。

化学式の表示

編集

化学式において、分子やイオンの数を上付き文字で示すこともできます。

<p>ナトリウムイオンは Na<sup>+</sup>、銅イオンは Cu<sup>2+</sup>、金イオンは Au<sup>3+</sup> です。</p>

脚註や参照

編集

脚註や参照文献などで使われる番号を上付き文字として表示する場合にも sup 要素が使用されます。

<p>これについての詳細は文献1<sup>1</sup>を参照してください。</p>

この場合、1 が上付き文字として表示されます。

属性

編集

<sup> 要素自体には属性がほとんどありませんが、CSSスタイルを使用してさらに細かくカスタマイズすることが可能です。例えば、上付き文字のサイズや位置を調整することができます。

例: CSSによるスタイリング

編集

上付き文字のサイズや位置を調整するために、CSSを使って<sup>要素をスタイルすることができます。

<style>
  sup {
    font-size: 1.5em;
    vertical-align: top;
  }
</style>
<p>x<sup>2</sup> + y<sup>2</sup> = z<sup>2</sup></p>

この例では、<sup> 要素内のテキストを標準の1.5倍のサイズで表示し、上方向に位置を調整しています。

使用例

編集

数学

編集
<p>3<sup>3</sup> = 27</p>

この式は、3 の3乗を表し、<sup> 要素を使って上付き文字の「3」を表示します。

化学式

編集
<p><sup>4</sup>He, <sup>12</sup>C, <sup>13</sup>13C, <sup>131</sup>I</p>

参照文献

編集
<p>この論文では、参考文献1<sup>1</sup>に記載された理論を基に議論しています。</p>

関連項目

編集

関連仕様

編集