Cosa sono e a cosa servono i CSS
CSS è l’acronimo di Cascading Style Sheets ovvero fogli di stile a cascata.
I fogli di stile rappresentano la soluzione consigliata dal W3C (World Wide Web Consortium) per garantire una completa separazione fra contenuti e formattazione in un documento (X)HTML.
Attraverso i CSS infatti è possibile applicare stili (ad. es. font, colori, spaziature, margini, bordi ecc… ) agli elementi che compongono la struttura di un documento web.
Inserire i CSS in un documento
A seconda di come vengono inclusi all’interno del documento (X)HTML i CSS vengono distinti in CSS esterni e CSS interni.
I fogli di stile esterni si dicono anche collegati, in questo caso si ha un documento con estensione .css esterno al documento (X)HTML al quale viene collegato all’interno della sezione mediante il tag LINK
Ad esempio
Gli attributi dell’elemento LINK sono :
REL: serve per dichiarare il tipo di relazione fra il foglio di stile e il documento (stylesheet o alternate stylesheet );
HREF: indica la posizione del file relativo al foglio di stile (l’url può essere assoluto o relativo);
TYPE: indica il tipo di file da collegare (text/css)
I CSS interni possono essere incorporati o in linea.
I fogli di stile incorporati sono inseriti direttamente nel documento (X)HTML tramite l’elemento STYLE all’interno della sezione HEAD.
Ad esempio
Le regole del foglio di stile si inseriscono dopo l’apertura del tag STYLE seguito dall’attributo obbligatorio TYPE.
I fogli di stile in linea si ottengono attraverso l’uso dell’attributo style, un attributo html applicabile ad ogni tag. E’ possibile quindi specificare ad ogni tag le regole di formattazione.
Ad esempio
E’ importante osservare che l’uso dei fogli di stile in linea rende nulli i vantaggi dei CSS: non si realizza quella importante distinzione fra struttura e presentazione tanto importante anche ai fini dell’accessibilità, ed inoltre si annulla la capacità dei CSS di assottigliare in maniera notevole il lavoro di formattazione. Attraverso la pubblicazione di un unico documento esterno al documento (X)HTML infatti si può variare con estrema semplicità l’aspetto dell’intero sito, cosa non possibile se si usano i fogli di stile in linea.
