CSS Shorthand: font

I’d actually like to use CSS shorthand in my code more, but the biggest problem I have is remembering the shorthand syntax!

If you’re anything like me, you need a reference, so here it is:

body {
  font: font-style font-variant font-weight font-size/line-height font-family;
}

And so, a practical example would be:

body {
  font: italic small-caps bold 14px/1.2em "Helvetica Neue",Arial,sans-serif;
}

Shorthand is definitely something to keep in mind when writing CSS, especially in large CSS documents, because using shorthand can definitely save you precious load time! I hope you’re helped by this little snippet!

Leave a Reply