4 Creare contenuti per il web - Andrea Giachetti

80
oppure:
Inserire i fogli di stile in un documento
...
Questi ultimi metodi sono vantaggiosi in quanto realizzano propriamente uno dei principali
vantaggi dell'uso dei fogli di stile, cioè la separazione tra documento che contiene struttura
logica e contenuto testuale e documento che contiene lo stile di rappresentazione. Questo fa sì
che si possa modificare lo stile di tutte le pagine che importano lo stesso file, modificando solo
quest'ultimo. L'altra possibilità cui avevamo accennato, cioè quella di inserire differenti stili per
differenti mezzi di visualizzazione può essere infine realizzata con l'attributo “media”, inserito
in o , es:
In questo caso ho due fogli di stile e se il documento HTML è visualizzato sullo schermo, userò
il primo, se è stampato, il secondo. I possibili valori per l'attributo “media” sono: “screen”
(desktop e laptop), “handheld” (PDA e smartphone), “print” (stampanti), “braille” (browser
braille), “embossed” (stampanti braille), “projection” (proiezioni), “speech” o “aural”
(sintetizzatori vocali), “tty” (telescriventi), “tv” (televisioni), “all” (tutti i dispositivi). Il
supporto all'interpretazione dell'attributo media, però, non è ancora largamente diffuso.
E' possibile definire fogli di stile alternativi anche senza che questi siano selezionati
automaticamente in base al tipo di terminale. Basta infatti definire per ciascun file di stile
importato un'etichetta con l'attributo “title”. Molti browser di ultima generazione (ad esempio
Mozilla Firefox) consentono in questo caso di scegliere il foglio di stile da usare tra i diversi
definiti dall'autore visualizzando le etichette in un menu (menù visualizza/stile pagina).
Si parla di fogli di stile a cascata in quanto, essendo possibile definire regole di stile in vari
modi e posizioni, in decodifica il browser scorre la lista delle regole per ciascun elemento della
pagina ed a parità di specificità della validità della regola, considera valida l'ultima. Si noti che
le regole di stile possono essere inserite anche localmente a livello del singolo elemento,
inserendo nell'elemento stesso l'attributo style=”...” seguito dalla definizione della regola
che si applicherà quindi al solo elemento che la contiene. Se non si utilizzano i fogli di stile
quest'ultima modalità è appunto quella che sostituisce la formattazione ottenuta con gli attributi
vecchio stile di HTML, in genere dichiarati “deprecated” nelle ultime versioni del linguaggio e
quindi da evitare.
Cerchiamo ora di chiarire cosa siano le regole di stile che troveremo, ad esempio, nei file
style.css degli esempi visti prima. La sintassi è molto semplice, ed è riportata in Figura 39:
prima di tutto si inserisce un selettore, che determina a quali parte del documento si applica la
regola, e poi un numero variabile di coppie proprietà-valore, che attribuiscono le proprietà di