Search within TutorialsPark

CSS font Property

A shorthand to to set all font properties in a single declaration

Definition and Notes.

1. The CSS font is a shorthand property to define all the aspects of element's font at once.

2. The properties must be in the order, font-style, font-variant, font-weight, font-size, line-height, font-family

3. Here, the properties of font-size and font-family are required, while all other are optional and will be set to default, if not specified.


CSS font property. internetexplorer safari firefox opera chrome

View in Splitscreen»


Note-A forward slash("/") must be used to seperate font-size and line-height

Property Values

Value Description
font-style To set the font-style.
font-variant The set the font-variant.Values possible are small-caps, normal, inherit
font-weight To set the font-weight.Values are either 'bold' or 'normal'.
font-size/line-height To set the font-size and the line height of the text.
font-family To specify the font-family(Eg: Verdana, Arial etc).
caption To set the font to be used for captioned controls(eg buttons, drop-down lists etc).
icon To set the font to be used to label icons.
menu To set the font to be used in menus(eg: dropdown menu and list menu).
message-box To set the font to be used in dialog box.
small-caption To set the font to be used for labeling small controls.
status-bar To specify the fonts to be used in window status bars.
inherit To set the width of the columns.


Specs Value
Name columns
Value [[<font-style> || <font-variant> || <font-weigth>]? <font-size>[/ || <line-height>]? <font-family>]
Initial Value see Individual Properties
Applies to all elements
Javascript syntax"bold small-caps normal 16px/1.2 verdana,sans-serif"
Inherited No
Computed Value See Individual Properties.
Browser Support internetexplorer safari firefox opera chrome

Related Examples.