Limited support 注意が必要。一部のブラウザのみ対応。プロダクション利用は慎重に判断すること。

font-variant-position

font-variant-position は CSS のプロパティで、上付き文字または下付き文字として配置された小さな代替文字の使用を制御します。

文字は変更されないまま、フォントのベースラインから相対的に配置されます。これらの文字はふつう、 <sub> と <sup> 要素で使用されます。

これらの代替文字の使用が有効の場合、一連の中のある文字がそのような字体 - 強調字体を持っていない場合、一連の文字のセット全体が代替方法を使用して、合成によって描画されます。

これらの代替字体は、フォントの他の部分と同じ em ボックスと同じベースラインを共有します。それらは単にグラフィカルに強化されており、行の高さや他のボックスの特性には影響しません。

上付き下付きOpenTypeグリフ

対応ブラウザ

1+対応 (バージョン) 未対応 ※注釈ありサブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

CSS

.superscript {
  font-variant-position: super;
}
.subscript {
  font-variant-position: sub;
}

CSS Super(superscript) demo.

CSS Sub(subscript) demo.

CSS Normal(normal) demo.