font-variant

Updated 2013.10.28 / Published 2007.02.02

font-variantプロパティはアルファベットなどの大文字・小文字をもつフォントに対して、スモールキャピタル表示にするか否かを指定します。スモールキャピタルとは英文字の小文字部分の代わりに、大文字を小さくさせたようなグリフ（文字の形）で表示するフォントです。

値

normal
small-caps
inherit

初期値

normal

適用対象

すべての要素

継承

する

メディア

visual

font-variantプロパティの値

font-variantプロパティの値には次の2種類のキーワードが指定できます。

normal: 標準（初期値）
small-caps: スモールキャピタル表示

スモールキャピタル表示は大文字・小文字のある言語にだけしか効果がないため、日本語の漢字・平仮名・カタカナの和文を対象にしても効果はありません。また、文字の表示書体（フォント名）を指定する font-familyプロパティにスモールキャピタルで表せないフォントが指定されている場合、仕様には大文字を縮小するなどしてフォントを擬似的に生成すべきとされますが、それもできない場合は最終的に普通の大文字のみで表示されます。なお、単に大文字に変換して表示したい場合は、text-transformプロパティ（text-transform : uppercase ;）を使用します。

font-variantプロパティの実装状況

IE: ◯
Firefox: ◯
Opera: ◯
Chrome: ◯
Safari: ◯
iOS: ◯
Android: ◯

サンプル

ul li       { font-family : "Times New Roman", Times, serif ; }
.nomal      { font-variant : normal ; }
.small-caps { font-variant : small-caps ; }