Example
Set a <p> element to a small-caps font:
document.getElementById("myP").style.fontVariant = "small-caps";Try it Yourself »
Definition and Usage
The fontVariant property sets or returns whether the font should be displayed in small capital letters.
This means that all lowercase letters will be converted to uppercase, but the letters will have a smaller font-size compared to the rest of the text.
Browser Support
The fontVariant property is supported in all major browsers.
Syntax
Return the fontVariant property:
object.style.fontVariant
Set the fontVariant property:
object.style.fontVariant="normal|small-caps|initial|inherit"
Property Values
| Value | Description |
|---|---|
| normal | The font is normal. This is default |
| small-caps | The font is displayed in small capital letters |
| initial | Sets this property to its default value. Read about initial |
| inherit | Inherits this property from its parent element. Read about inherit |
Technical Details
| Default Value: | normal |
|---|---|
| Return Value: | A String, representing a font in either normal or small capital letters |
| CSS Version | CSS1 |
More Examples
Example
Return the font variant of a <p> element:
alert(document.getElementById("myP").style.fontVariant);
Try it Yourself »
Related Pages
CSS tutorial: CSS Font
CSS reference: font-variant property
HTML DOM reference: font property
< Style Object