CSS Property - Font Variant

Value: normal | small-caps
Initial: normal
Applies to: all elements
Inherited: yes
Percentage values: N/A

Another type of CSS font variation within a font family is the small-caps. In a small-caps font the lower case letters look similar to the uppercase ones, but in a smaller size and with slightly different proportions. The "font-variant" property selects that font.

A value of "normal" selects a font that is not a small-caps font, "small-caps" selects a small-caps font. It is acceptable (but not required) in CSS1 if the small-caps font is a created by taking a normal font and replacing the lower case letters by scaled uppercase characters. As a last resort, uppercase letters will be used as replacement for a small-caps font.

The following example results in an "H3" element in small-caps, with emphasized words in oblique small-caps:


h1 {font-variant: small-caps;}
p {font-variant: oblique;}

There may be other variants in the font family as well, such as fonts with old-style numerals, small-caps numerals, condensed or expanded letters, etc. CSS1 has no properties that select those.

CSS1 core: insofar as this property causes text to be transformed to uppercase, the same considerations as for "text-transform" apply.