Talen

Dit is een vertaling. Hij kan fouten bevatten of verouderd zijn t.o.v. de Engelse versie. Vertaler: Saffier Verkaik

Web Style Sheets CSS tips & trucs

Zie ook de index van alle tips.

Op deze pagina:

Groepen lettertypen

Na de kleur is het lettertype vermoedelijk de meest elementaire eigenschap van een pagina. Op deze pagina zal ik geen "trucjes" tonen, maar ik zal u de reeks van lettertype variaties tonen die CSS toestaat.

Omdat niet alle lettertypen verkrijgbaar zijn op alle computers (er zijn duizenden lettertypen en de meeste zijn niet gratis), verzorgt CSS een systeem van uitwijkmogelijkheden. U geeft het lettertype op dat u als eerste wilt, dan elk lettertype die het eerste type misschien zou kunnen vervangen indien het type niet beschikbaar is en u zou de lijst met een algemeen lettertype moeten beëindigen, waarvan er vijf zijn: schreef, zonder-schreef, monospace, cursief en fantasie.

De volgende tabel toont voorbeelden van verschillende lettertypen (uw browser zal ze misschien niet allemaal kennen) en u kunt zien wat uw browser met elk van de vijf algemene typen doet:

Lettertype Uw browser Voorbeeldplaatje
'sans-serif': normal fonts without serifs
Arial, sans-serif The Quick Brown Fox Jumps Over The Lazy Dog
Helvetica, sans-serif The Quick Brown Fox Jumps Over The Lazy Dog
Verdana, sans-serif The Quick Brown Fox Jumps Over The Lazy Dog
Trebuchet MS, sans-serif The Quick Brown Fox Jumps Over The Lazy Dog
Gill Sans, sans-serif The Quick Brown Fox Jumps Over The Lazy Dog
Noto Sans, sans-serif The Quick Brown Fox Jumps Over The Lazy Dog
Avantgarde, TeX Gyre Adventor, URW Gothic L, sans-serif The Quick Brown Fox Jumps Over The Lazy Dog
Optima, sans-serif The Quick Brown Fox Jumps Over The Lazy Dog
Arial Narrow, sans-serif The Quick Brown Fox Jumps Over The Lazy Dog
sans-serif The Quick Brown Fox Jumps Over The Lazy Dog
'serif': normal fonts with serifs
Times, Times New Roman, serif The Quick Brown Fox Jumps Over The Lazy Dog
Didot, serif The Quick Brown Fox Jumps Over The Lazy Dog
Georgia, serif The Quick Brown Fox Jumps Over The Lazy Dog
Palatino, URW Palladio L, serif The Quick Brown Fox Jumps Over The Lazy Dog
Bookman, URW Bookman L, serif The Quick Brown Fox Jumps Over The Lazy Dog
New Century Schoolbook, TeX Gyre Schola, serif The Quick Brown Fox Jumps Over The Lazy Dog
American Typewriter, serif The Quick Brown Fox Jumps Over The Lazy Dog
serif The Quick Brown Fox Jumps Over The Lazy Dog
'monospace': fixed-width fonts
Andale Mono, monospace The Quick Brown Fox Jumps Over The Lazy Dog
Courier New, monospace The Quick Brown Fox Jumps Over The Lazy Dog
Courier, monospace The Quick Brown Fox Jumps Over The Lazy Dog
FreeMono, monospace The Quick Brown Fox Jumps Over The Lazy Dog
OCR A Std, monospace The Quick Brown Fox Jumps Over The Lazy Dog
DejaVu Sans Mono, monospace The Quick Brown Fox Jumps Over The Lazy Dog
monospace The Quick Brown Fox Jumps Over The Lazy Dog
'cursive': fonts that emulate handwriting
Comic Sans MS, Comic Sans, cursive The Quick Brown Fox Jumps Over The Lazy Dog
Apple Chancery, cursive The Quick Brown Fox Jumps Over The Lazy Dog
Bradley Hand, cursive The Quick Brown Fox Jumps Over The Lazy Dog
Brush Script MT, Brush Script Std, cursive The Quick Brown Fox Jumps Over The Lazy Dog
Snell Roundhand, cursive The Quick Brown Fox Jumps Over The Lazy Dog
URW Chancery L, cursive The Quick Brown Fox Jumps Over The Lazy Dog
cursive The Quick Brown Fox Jumps Over The Lazy Dog
'fantasy': decorative fonts, for titles, etc.
Impact, fantasy The Quick Brown Fox Jumps Over The Lazy Dog
Luminari, fantasy The Quick Brown Fox Jumps Over The Lazy Dog
Chalkduster, fantasy The Quick Brown Fox Jumps Over The Lazy Dog
Jazz LET, fantasy The Quick Brown Fox Jumps Over The Lazy Dog
Blippo, fantasy The Quick Brown Fox Jumps Over The Lazy Dog
Stencil Std, fantasy The Quick Brown Fox Jumps Over The Lazy Dog
Marker Felt, fantasy The Quick Brown Fox Jumps Over The Lazy Dog
Trattatello, fantasy The Quick Brown Fox Jumps Over The Lazy Dog
fantasy The Quick Brown Fox Jumps Over The Lazy Dog

Lettertype stijlen

De meeste lettertypen hebben verschillende stijlen binnen dezelfde groep, voornamelijk een vet gedrukte en een cursieve stijl, dikwijls ook een vette cursieve stijl, enigszins minder vaak een stijl van kleine hoofdletters en in enkele gevallen extra-lichte / extra-vette of uitgerekte / ingekrimpte versies.

De tabel hieronder toont een aantal verschillende stijlen. Tenzij u een hele rijke verzameling van lettertypen heeft, zullen velen van de rijen dezelfde zijn.

rule serif sans-serif
Styles
font-style: normal The Quick… The Quick…
font-style: italic The Quick… The Quick…
font-style: oblique The Quick… The Quick…
Weights
font-weight: 100 The Quick… The Quick…
font-weight: 200 The Quick… The Quick…
font-weight: 300 The Quick… The Quick…
font-weight: normal The Quick… The Quick…
font-weight: 500 The Quick… The Quick…
font-weight: 600 The Quick… The Quick…
font-weight: bold The Quick… The Quick…
font-weight: 800 The Quick… The Quick…
font-weight: 900 The Quick… The Quick…
Variants
font-variant: normal The Quick… The Quick…
font-variant: small-caps The Quick… The Quick…
Stretch
font-stretch: ultra-condensed The Quick… The Quick…
font-stretch: extra-condensed The Quick… The Quick…
font-stretch: condensed The Quick… The Quick…
font-stretch: semi-condensed The Quick… The Quick…
font-stretch: normal The Quick… The Quick…
font-stretch: semi-expanded The Quick… The Quick…
font-stretch: expanded The Quick… The Quick…
font-stretch: extra-expanded The Quick… The Quick…
font-stretch: ultra-expanded The Quick… The Quick…

De "CSS Fonts Module" heeft nog meer eigenschappen om speciale stijlen te kiezen (in het geval van lettertypes met verscheidene varianten), in het bijzonder de eigenschap font-variant heeft veel meer waarden.

Bert Bos, leider stijl-activiteiten
Copyright © 1994–2021 W3C® Privacy

geschreven 17 januari 2001;
laatste update wo 06 jan 2021 05:40:49 UTC

Talen

Over de vertalingen