HTML & CSS

最終更新日:
公開日:

リファレンス

CSS

フォント ヴァリアント

font-variantプロパティ

テキストでスモールキャップを表現したい場合に使用するプロパティです。スモールキャップとは、小文字と同じ大きさで書かれた大文字のアルファベットです。

  • 初期値

    normal

  • 継承

    継承あり

  • 適用できる要素

    全要素

次のような値を設定することができます。

  • normal(初期値)
  • small-cpas – スモールキャップを適用します

パターン1

上記スタイルの指定例です。2つ目のテキストにスモールキャップが指定されています。

CSSコード例

<style type="text/css">
.sample_css1 .text1 {
	font-variant: normal;
}
.sample_css2 .text1 {
	font-variant: small-caps;
}
</style>
<div class="sample_css1">
	<p class="text1">Cascading Style Sheet</p>
</div>
<div class="sample_css2">
	<p class="text1">Cascading Style Sheet</p>
</div>

「normal」を指定した表示例:

Cascading Style Sheet

「small-caps」を指定した表示例:

Cascading Style Sheet

こちらの記事は役に立ちましたか?

ありがとうございます。
もしよろしければ、あわせてフィードバックや要望などをご入力ください。

コメントありがとうございます!
運営の参考にさせていただきます。