Activiteiten
Tech. rapporten
Site Index
Vertalingen
Software
Zoeken
Vergelijkbaar:
Style
CSS
tips & trucs
Bert Bosgeschreven 17 januari 2001;
laatste update datum: 09/23/2008 11:18:00 $ GMT
Dit document is een Nederlandse vertaling van een Engelstalig document: |
(This page uses CSS style sheets)
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:
| '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 |
Gill Sans, sans-serif
| The Quick Brown Fox Jumps Over The Lazy Dog |
Lucida, sans-serif
| The Quick Brown Fox Jumps Over The Lazy Dog |
Helvetica 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, serif
| The Quick Brown Fox Jumps Over The Lazy Dog |
Times New Roman, serif
| The Quick Brown Fox Jumps Over The Lazy Dog |
Palatino, serif
| The Quick Brown Fox Jumps Over The Lazy Dog |
Bookman, serif
| The Quick Brown Fox Jumps Over The Lazy Dog |
New Century Schoolbook, 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 |
Lucidatypewriter, monospace
| The Quick Brown Fox Jumps Over The Lazy Dog |
Fixed, 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, Comic Sans MS, cursive
| The Quick Brown Fox Jumps Over The Lazy Dog |
Zapf Chancery, cursive
| The Quick Brown Fox Jumps Over The Lazy Dog |
Coronetscript, cursive
| The Quick Brown Fox Jumps Over The Lazy Dog |
Florence, cursive
| The Quick Brown Fox Jumps Over The Lazy Dog |
Parkavenue, 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 |
Arnoldboecklin, fantasy
| The Quick Brown Fox Jumps Over The Lazy Dog |
Oldtown, fantasy
| The Quick Brown Fox Jumps Over The Lazy Dog |
Blippo, fantasy
| The Quick Brown Fox Jumps Over The Lazy Dog |
Brushstroke, fantasy
| The Quick Brown Fox Jumps Over The Lazy Dog |
fantasy
| The Quick Brown Fox Jumps Over The Lazy Dog |
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… | |||
In CSS3 is nog een stijl verkrijgbaar: 'font-effect' die de letters er gegraveerd of uitgebeiteld uit laat zien.
Activiteiten
Tech. rapporten
Site Index
Vertalingen
Software
Zoeken
Vergelijkbaar:
Style
CSS
tips & trucs
Bert Bos