CSS shorthand for font properties

The CSS properties discussed so far can be written in shorthand, enabling you to cut down on space and manage your CSS font settings with greater ease. Like some other shorthand properties, some rules apply:
1.Some browsers are more forgiving than others regarding required and optional values, but you should always specify the font-size and font-family values, in that order.
2.Omitted values revert to default settings.

3.The font-style, font-weight, and font-variant values, if included, should be placed at the start of the rule (in any
order), prior to the font-size value.
4.The font-size and line-height values can be combined using the syntax font-size/line-height (e.g., 12px/16px for
12px font-size and 16px line-height).
A complete font declaration in shorthand could therefore look like this:
p { font: italic small-caps bold 100%/1.3em Arial, Helvetica, sans-serif;  }
The equivalent in longhand is the following:
p { font-style: italic; font-variant: small-caps; font-weight: bold; font-size: 100%; line-height: 1.3em; font-family:
Arial, Helvetica, sans-serif; }
As you can see, this is rather weightier!

An invalid font declaration is shown in the following code block. Here, the font-weight value (bold) is incorrectly placed after the font-family value, and the font-size value is missing.
p.invalid { font: Arial, Helvetica, sans-serif bold; }

Related posts:

1. Using Shorthand Properties in CSS Your body rule should now look like this: body {...
2. Setting a default font and font color using CSS As mentioned earlier, the body start tag was historically used...
3. Using Property Values Property values come in the following forms: constant text, constant...
4. Working with CSS shorthand for boxes This is something that is useful to get to grips...

Related posts brought to you by Yet Another Related Posts Plugin.