CSS Tutorial Fonts

The code below will provide an example of the CSS source code.

p.sample {
font-family: sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal;
font-size: medium;
line-height: 100%;
word-spacing: normal;
letter-spacing: normal;
text-decoration: none;
text-transform: none;
text-align: left;
text-indent: 0ex;


CSS Font Family

With the font-family, you can specify an actual font name, like “sans-serif" in the custom field. All fonts should fall within “quotes” and should be case-insensitive.

You can specify a comma-separated list of font names, which will be used in the order listed when some are not found on the user's system.

It’s important to remember not all your visitors will be visiting your site through a sophisticated browser, this may result in the browser not recognising your particular font, for this reason we have the option to specify several fonts. It’s always good practice to follow your desired font with several common fonts in the example below.

p.sample {
“sans-serif”, "Verdana", "Arial"

CSS Font Attributes

font-family font name font-family:arial
  generic font font-family:arial, sans-serif
font-style normal font-style:normal
  italic font-style:italic
  underlined font-style:underlined
  oblique font-style:oblique
font-weight normal font-weight:normal
  bold font-weight:bold
  bolder font-weight:bolder
  lighter font-weight:lighter
font-size normal font-size:normal
  length font-size:14px
  absolute font-size:xx-small
  relative font-size:smaller
  percentage font-size:50%
font-variant normal font-variant:normal
  small caps font-variant:small-caps
  upper case font-variant:upper-caps

comments powered by Disqus