justdesign

Web stuff | Dokumenter

Doctypes |

Skabeloner |

Fonts & CSS |

Kodestumper |

Tests & Demos |

Referencer |

Skrifttyper og CSS

Font familier:

  serif:      en Antikva skrift:  Lorem ipsum dolor sit amet...
  sans-serif: en Grotesk skrift:  Lorem ipsum dolor sit amet...
  cursive:    en “håndskrift”:    Lorem ipsum dolor sit amet...
  fantasy:    en “fancy” skrift:  Lorem ipsum dolor sit amet...
  monospace:  en fast spatieret skrift: Lorem ipsum dolor sit amet...
 
Eks.: { font-family: Arial, "Trebuchet MS", Helvetica, sans-serif; }
 
OBS! Resultatet med “cursive” og “fantasy” er ret uforudsigelig...
Prøv denne side med forskellige browsere!

Font / tekst egenskaber i CSS:

{ text-transform: none       }
                  capitalize
                  uppercase
                  lowercase

{ font-style: normal  }
              italic
              oblique

{ font-variant: normal     }
                small-caps

{ font-weight: normal  }
               bold
               bolder
               lighter
               100
               …
               900

Linieafstand:

{ line-height: normal }
               number
               length
               %
               
  Eks.: p { line-height: 1.5; } for halvanden linieafstand

Links (rækkefølge!):

  a:link    { color: foo; }  ubesøgte links
  a:visited { color: bar; }  besøgte links
  a:hover   { color: baz; }  musemarkør over
  a:active  { color: quz; }  aktive links

CSS-% v/s “gamle” HTML font størrelser (ca.):

   70% = size 1
   84% = size 2
  100% = size 3
  120% = size 4
  150% = size 5
  200% = size 6
  300% = size 7

Eksempler (mere præcis)

“body” skal have “font-size:100%”...

Top