This page is Ready to Use

Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github.

font-variant

Summary

Selects a normal, or small-caps face from a font family. Also possible by using the font shorthand.

Overview table

Initial value
normal
Applies to
All elements
Inherited
yes
Media
visual
Computed value
As specified
Animatable
no
CSS Object Model Property
fontVariant
Percentages
N/A

Syntax

  • font-variant: inherit
  • font-variant: normal
  • font-variant: small-caps

Values

normal
Default. Specifies a normal font face.
small-caps
Specifies a small-caps labeled font. If no small-case font is available, some browser (e.g. Firefox) simulate a small-case font by replacing the lowercase characters by scaled uppercase letters.
inherit
Inherit to the parent element.

Examples

A simple example to show the effect achieved when small-caps are applied to a text paragraph

<p>I think WebPlatform rocks</p>

View live example

The CSS applied to the HTML above.

p {
  font-variant: small-caps;
}

Related specifications

CSS 3
W3C Candidate Recommendation
CSS 2.1
W3C Recommendation

See also

Related articles

Fonts

Related pages

Attributions