I Fogli di Stile (CSS) di Web-Link: Tutto per la costruzione delle tue pagine web

Gli attributi per il font  (carattere)

Prima di passare in rassegna le categorie di attributi vorrei ricordare la loro sintassi per poterli adoperare, e questo qualunque sia il modo che deciderete di usare.

Gli attributi devono essere inseriti all’interno di parentesi graffe { } e laddove in HTML verrebbe usato un “=” (uguale) viene invece usato “:” (due punti). Argomenti consecutivi sono separati da “;” (punto e virgola) invece che da “,” (virgola). Inoltre molti argomenti sono divisi da – (trattini) anche se questi fanno parte integrante del nome stesso.

Per i parametri ad essi associabili fare riferimento a questa tabellina.

Passiamo in rassegna gli attributi per il carattere:

font-family : famiglia1 famiglia2 famiglia3 ; Si possono elencare più famiglie di caratteri per dare la possibilità al browser di selezionare quella presente sulla macchina del visitatore. Si tenterà di visualizzare la prima specificata per poi passare a quelle successive nel caso in cui non fossero presenti quelle precedenti. A questo proposito è opportuno descrivere le possibili alternative partendo proprio da quelle più rare.

Le famiglie si separano da uno spazio vuoto o da una virgola e nel caso in cui il nome della famiglia fosse composto da più di una sola parola, per esempio: MS Sans Serif, questo dovrà essere racchiuso fra virgolete (doppie o singole) “MS Sans Serif”.

font-family: ‘MS Serif’, ‘New York’, serif;
font-family: verdana, arial;

font-size : lunghezza | dim. assoluta | dim. relativa | percentuale ; Si possono esprimere le dimensioni del font facendi riferimento a uno dei quattro possibili attributi, vedi anche tabellina parametri.

Di solito si adoperano i punti (pt), ma qualsiasi altro parametro andrà sintatticamente bene.

font-size: 12pt
font-size: 150%

font-style : normal | italic | oblique; Si puo eseguire il rendering dei caratteri in corsivo.

font-style: italic;
font-style: normal

font-variant : normal | small-caps ; Simile a font-style assegna tutte maiuscole grandi per le lettere maiuscole e maiuscole piccole per le lettere minuscole. normal per rimuovere il tutto.

font-variant: small-caps;
font-variant: normal

font-weight : bold | bolder | lighter | normal; Per impostare lo spessore del testo. Oltre ai parametri sopra è possibile introdurre anche un numero da 100 a 900 con incremanti di 100, e soltanto a partire dal valore 700 si avvertirà l’effetto grassetto.

font-weight: bold;
font-weight: lighter;

Continua: Colore e sfondo