CSS Shorthand Font Property

There are two ways to write CSS: Longhand and Shorthand.  Both accomplish the same thing.  Using shorthand you can save keystrokes and minimize lines, which will decrease your file sizes.

Example of setting your font-properties the traditional longhand way:

font-size: 12px;
font-family: "Times New Roman", Times;
font-style: italic;
font-weight: bold;
line-height: 1.4em;

In shorthand, the CSS code becomes:

font: italic small-caps normal 12px/1.4em "Times New Roman", Times;

9 responses to “CSS Shorthand Font Property”

  1. danraabe Avatar

    How do I change the menu font size in Albedo. Im my web browser the menu needs to be a bit more prominent.

    1. heather Avatar

      I have the same exact problem and question. I’d love to change the font size for the menu. HELP!

  2. Dan Filbin Avatar

    I am also trying to change the font size in the menu. I copied this (font-size: 12px;)into the customization field for fonts, but they didn’t change? Thanks for your help.

    1. Graph Paper Press Avatar

      The syntax is:
      .class-to-change { font-size: 12px; }

  3. gonzalesness Avatar

    Hi, I have Seneca, and I love the fonts, I just don’t like the shadow effect on the site title. I am not familiar with css, but in the editor i found this:

    #site-title {

    display: block;

    text-shadow: 1px 1px 0 #F2EFE6, 2px 2px 0 #444;

    text-transform: uppercase;

    font-weight: bold;

    font-size: 4em;

    Would I just delete the part that says text shadow? Any help is much appreciated. I would hate to mess anything up.

  4. dick Avatar

    The custom CSS box doesn’t appear to work at all. Either that or everyone posting is missing something obvious…

    1. Graph Paper Press Avatar

      It works. Are you actually applying the CSS about to an html element? You would do it like this:

      p { font: italic small-caps normal 12px/1.4em “Times New Roman”, Times; }

  5. Dhiyanesh Avatar

    Hi, how can I change the default font colour of wordpress posts? Also the earlier bold fonts are not visible either. Please help.

Leave a Reply

Your email address will not be published. Required fields are marked *