Web Style Sheet
CCS savjeti i trikovi

Dokument http://www.innerviewme.com/007/fonts.html, je prijevod i može sadržati pogreške. Originalni službeni dokument može se vidjeti na https://www.w3.org/Style/Examples/007/fonts.html. Pogreške možete prijaviti na moj e-mail matthewjon75@yahoo.com.
Cabins For Sale In Gatlinburg Cabins For Sale in Pigeon Forge www.300yards.com

(This page uses CSS style sheets)

Vrste fontova

Stilovi fontova

Vrste fontova

Posle boja, fontovi su vjerojatno najosnovnije svojstvo stranice. Na ovoj stranici neću pokazati nikakve trikove, već ću pokazati opseg varijacija fontova koje CSS dozvoljava

Kako nisu svi fontovi raspoloživi na svim računalima (postoje tisuće fontova i većina ih nije besplatna), CSS obezbjedjuje sistem uzmicanja. Prvo navedete font koji prvo želite, zatim fontove koji će poslužiti kao zamjena ako prvi nije dostupan, a listu trebate završiti sa generičkim fontom, serif, sans-serif, monospace, cursive i fantasy.

Slijedeća tabela pokazuje primjere raznih fontova (vaš ih preglednik možda ne prepoznaje sve) i možete vidjeti što vaš preglednik radi sa svakim od pet generičnih fontova:

'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

Stilovi fontova

Većina fontova iste vrste ima različite stilove, u pravilu podebljane i kurzivne (ukošene), često i podebljane i ukošene, nešto ređe male verzalne i u nekim slučajevima dodatno tanke / dodatno podebljane ili rastegnute/zgusnute verzije.

Donja tabela pokazuje niz raznih stilova. Mnogi od redaka bit će isti, osim ako imate vrlo bogatu zbirku fontova.

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…