Quackit Logo

CSS font

Also see the full, alphabetical list of CSS properties


The CSS font property is a shorthand property for setting font-family, font-size, font-variant, font-style, font-weight, and line-height. This saves time and space - if you use the 'font' property, you don't need to specify each one separately.

Syntax: font: <value1> <value2> ...
Possible Values:
  • font-style
  • font-variant
  • font-weight
  • font-size/line-height
  • font-family
Initial Value: None
Applies to: All elements
Inherited: Yes
Media: Visual
Example p { font: 14pt/16pt fantasy, cursive, Serif }
Try it yourself! HTML Editor


System Fonts

You can also specify styles for system fonts.

ValueDescription
caption Specifies font properties for captioned controls. For example, buttons, drop-downs, etc.).
icon Specifies font properties for label icons.
menu Specifies font properties for menus. For example, dropdown menus and menu lists.
message-box Specifies font properties for dialog boxes.
small-caption Specifies font properties for labeling small controls.
status-bar Specifies font properties for window status bars.

Example:

button { font: 300 italic "Verdana", sans-serif }

Also see all CSS properties listed alphabetically


Enjoy this website?

  1. Link to this page (copy/paste into your own website or blog):
  2. Add this page to your favorite social bookmarks sites:
                     
  3. Add this page to your Favorites

Oh, and thank you for supporting Quackit!