CSS font-variant
This CSS property sets the variation of the font family.
The font-variant property defines whether or not a text should be displayed in a small-caps font.
In a small-caps font family, all lowercase letters are converted to uppercase letters. However, the converted uppercase letters appear in smaller font size than the original uppercase letters in the text.
Syntax:
font-variant: normal | small-caps | initial | inherit
Property Values:
- normal: Specifies the normal font-face.
- small-caps: The lowercase letters are displayed as uppercase letters but in a smaller size.
- initial: Property to its default value.
- inherit: Property from its parent element.
Example:
<!DOCTYPE html> <html> <head> <style> p { font-variant: small-caps; font-size: 25px; } h2 { font-variant: normal; } </style> </head> <body> <h2> This heading is shown in the normal font. </h2> <p> HELLO WORLD </p> <p> hello world. This text is affected by the <b> small-caps </b> value. </p> </body> </html>
OUTPUT: