CSS Font Property

❮ Previous Next ❯

The CSS Font Property

To shorten the code, it is also possible to specify all the individual font properties in one property.

The font property is a shorthand property for:

  • font-style
  • font-variant
  • font-weight
  • font-size/line-height
  • font-family

Note: The font-size and font-family values are required. If one of the other values is missing, their default value are used.

Example

Use font to set several font properties in one declaration:

p.a {
  font: 20px Arial, sans-serif;
}

p.b {
  font: italic small-caps bold 12px/30px Georgia, serif;
}
Try it Yourself »

Test Yourself With Exercises

Exercise:

Set the font for <h1> to "Verdana".

<style>
h1 {
  : Verdana;
}
</style>

<body>
  <h1>This is a heading</h1>
  <p>This is a paragraph</p>
</body>

Start the Exercise

All CSS Font Properties

Property Description
font Sets all the font properties in one declaration
font-family Specifies the font family for text
font-size Specifies the font size of text
font-style Specifies the font style for text
font-variant Specifies whether or not a text should be displayed in a small-caps font
font-weight Specifies the weight of a font

❮ Previous Next ❯
Copyright 1999-2023 by Refsnes Data. All Rights Reserved.