Producing web pages
* HTML CSS DHTML XHTML A to Z of tags        Accessibility          Design

Font properties

These properties control typography.

Property

Description

Values

Example<

font

Shorthand for all the font properties

font-family
font-size
font-style
font-variant
font-weight
caption
icon
menu
messagebox
smallcaption
statusbar

{font :bold 12pt helvetica,sans serif}

font-family

Sets a specific typeface or generic font family.

font family name

{font-family: courier}

font-size

Sets size of text.

absolute size
relative size
millimetres (mm)
centimetres (cm)
inches (in)
points (pt)
picas (pc)
pixels (px)
height of font (em)
height of letter x (ex)
percentage

{font-size: 12pt}
{font-size: large}
{font-size: smaller}
{font-size: 75%}

font-size-adjust

Adjusts the font size

number
none

{font-size-adjust :14}

font-stretch

Stretches or shrinks characters horizontally

normal
wider
narrower
ultra-condensed
extra-condensed
condensed
semi-condensed
semi-expanded
expanded
extra-expanded
ultra-expanded

{font-stretch: condensed}

font-style

Italicises text.

normal
italic
oblique

{font-style: italic}

font-variant

Sets a font variation

normal
small-caps

{font-variant: small-caps}

font-weight

Sets thickness of type. Makes text heavier or lighter

normal
bold
lighter
bolder
100, 200, 300 up to 900

{font-weight: bold}

@font-face

Embeds fonts

url

@font-face url(font.eot)