CSS: Font


Tramite i CSS, puoi impostare le proprieta' dei font. Ci sono 5 opzioni che puoi impostare:
  1. Font-family
  2. Font-style
  3. Font-variant
  4. Font-weight
  5. Font-size

Font-family

Ci sono parecchie famiglie di font, e devi prestare molta attenzione nello sceglierne una. Infatti puo' capitare che il browser di un lettore non riesca a riconoscere una data famiglia. Quindi conviene specificare piu' di una famiglia contemporaneamente e, inoltre, e' convieniente usare una famiglia generica di font come ultima alternativa. Le famiglie generiche sono:

  1. 'serif (es. Times)
  2. 'sans-serif' (es. Helvetica)
  3. 'cursive' (es. Zapf-Chancery)
  4. 'fantasy' (es. Western)
  5. 'monospace' (es. Courier)

I valori della proprieta' 'Font-family', sono separati da una virgola, e l' ultimo e' la famiglia generica. Osserva il seguente esempio:

body { font-family : gill, helvetica, sans-serif }

Gill e' una famiglia, helvetica e' una seconda famiglia, ed infine sans-serif e' la famiglia generica. Ricorda: dovresti sempre usare una famiglia generica. Quando il tuo font ha un nome come: 'new century schoolbook', devi indicarlo tra apici, ("new century schoolbook") perche' altrimenti il browser assumera' un font erroneamente.

Font-style

Font-style puo' essere: 'normal' (cioe' il valore di default) o 'italic'. Esempio:

h1 { font-family : helvetica, sans-serif; font-style : italic }

Font-variant

Font-variant puo' essere: 'normal' o 'small-caps'. Small-caps significa che le lettere minuscole sembreranno simili a quelle maiuscole, ma in misura minore. Esempio:

h1 { font-family : helvetica, sans-serif; font-style : italic; font-variant : small-caps }

Font-weight

Font-weight puo' essere: 'normal', 'bold', 'bolder' o lighter. Puoi anche usare un valore numerico: 100, 200, 300, 400, 500, 600, 700, 800, 900. Questi valori formano una sequenza ordinata e ciascun numero significa un peso. '400' e 'normal' sono la stessa cosa e anche '700' e 'bold' sono la stessa cosa. Esempio:

H1 { font-weight : normal } (you could also write: H1 { font-weight : 400 })

Font-size

Puoi specificare una dimensione assoluta, una relativa, un valore od una percentuale. Una dimensione assoluta e' un valore che fa riferimento ad una tabella di font gestita dal client (il browser). Una dimensione relativa e' un parametro riferito alla dimensione del font dell' elemento padre. Puo' essere 'larger' o 'smaller'. Length e' il valore effettivo del font. Percentage e' la percentuale riferita alla dimensione del font dell' elemento padre. Esempi:

p { font-size : 12pt }
p { font-size : larger }
p { font-size : 1.5em }
p { font-size : 150% }

Attenzione: pt significa point, ed e' un valore assoluto, comunque puoi anche usare: 'in' che significa inches, 'cm' che significa centimeters, 'mm' che significa millimeters e 'pc' che significa picas.


      Home  Pag. prec.  Pag. succ.       Chi siamo?  Scrivici!

Copyright (c) 1998-2006 Wowarea