Il CSS (Cascading Style Sheets, in italiano fogli di stile), in informatica, è un linguaggio usato per definire la formattazione di documenti HTML, XHTML e XML ad esempio in siti web e relative pagine web. Le regole per comporre il CSS sono contenute in un insieme di direttive (Recommendations) emanate a partire dal 1996 dal W3C.

L’introduzione del CSS si è resa necessaria per separare i contenuti dalla formattazione e permettere una programmazione più chiara e facile da utilizzare, sia per gli autori delle pagine HTML che per gli utenti, garantendo contemporaneamente anche il riuso di codice ed una sua più facile manutenibilità.

Storia[modifica sorgente]

Per permettere agli autori di poter plasmare liberamente l’aspetto delle pagine web, dal 1993 in poi Netscape Navigator ed Internet Explorer, i due browser che si disputavano gli utenti nella nota guerra dei browser, presentarono tag proprietari, ovvero non aderenti agli standard e non compatibili con i browser concorrenti. Un esempio di questi tag è <font> che va a definire il font.

Questi tag proprietari di formattazione erano l’unico modo per gli autori di definire la formattazione e così il loro uso è diventato massiccio. Tuttavia questi tag presentavano tre problemi:
1.Il primo problema è costituito dalla lunghezza di questi tag. Se confrontata con una pagina che adotta il linguaggio CSS, una pagina che non lo adotta è in genere più pesante (in termini di bit) in un rapporto che spesso raggiunge il 200%. Inoltre, le istruzioni CSS possono essere raccolte in un file esterno che rimane memorizzato nella cache del browser, riducendo ulteriormente la quantità di dati che i server devono trasmettere.
2.Il secondo problema risiede nella mancanza di logica del codice (X)HTML. Un codice non aderente agli standard, ridondante e confuso comporta infatti molto lavoro aggiuntivo per i browser, che devono cercare di correggere ed interpretare (quando possibile) direttive arbitrarie.
3.Il terzo problema comincia a diventare sempre più rilevante ed è la mancanza di compatibilità con i nuovi computer palmari e gli smartphone. Queste pagine infatti sono progettate per schermi con risoluzione minima 800×600 pixel. I palmari, che hanno una risoluzione inferiore ed una forma dello schermo ben diversa dal rapporto 4:3 dei monitor per computer, si trovano quindi impossibilitati a visualizzare correttamente la pagina e l’utente dovrà tentare di “decodificarla”, operazione spesso molto scomoda.

Un’ulteriore questione era che, nelle pagine web non standard, ovvero l’uso del tag <table> (le tabelle) per realizzare l’impaginazione delle pagine web. Questo viene considerato dai puristi come inaccettabile in quanto le tabelle sono pensate per impaginare dati tabulari e non layout web. Oltre a questo, l’uso delle tabelle comporta anche svantaggi pratici: aumento del peso delle pagine, come già indicato al problema 1, e peggioramento dell’accessibilità, in quanto l’ordine logico dei dati può dover essere sacrificato per motivi di layout. Nonostante tutto, alcuni sostengono l’uso delle tabelle per la loro maggior facilità di implementazione.

CSS 1

Per tentare di risolvere questa situazione, nel 1996 il W3C emanò le specifiche CSS 1. I CSS 1 erano un interessante sistema per separare contenuto da formattazione. La base di questo linguaggio, infatti, consisteva nel fatto che il contenuto sarebbe stato sempre definito dal codice (X)HTML, mentre la formattazione si sarebbe trasferita su un codice completamente separato, il CSS appunto. I richiami tra i due codici venivano effettuati tramite due particolari attributi: class e ID. Queste specifiche:
1.Erano un’efficace soluzione al primo problema (escludendo la questione del tag <table>) perché riducevano notevolmente le dimensioni delle pagine.
2.Risolvevano il secondo in modo parziale perché consentivano al codice (X)HTML di ritornare in gran parte semplice ed essenziale, ma presentavano qualche mancanza che costringeva a ricorrere ai tag HTML.
3.Non prendevano però in considerazione il terzo, dato che nel 1996 i PDA (i palmari) erano scarsamente diffusi.

I CSS 1 sviluppavano un’idea semplice ma efficace, ma nonostante le loro grandi potenzialità non ebbero successo a causa della mancanza di browser in grado di supportarli.

CSS 2 e CSS 2.1

Per includere le nuove funzionalità e rendere i CSS un linguaggio ben supportato, nel 1998 il W3C emanò le specifiche CSS 2 e nel 2004 le specifiche CSS 2.1. I CSS 2 sono la naturale evoluzione dei CSS 1 ed offrono potenti soluzioni per risolvere soprattutto il terzo problema, con la possibilità di creare fogli di stile separati per i dispositivi portatili. Anche il secondo problema è ormai pienamente risolvibile, scrivendo una pagina (X)HTML esclusivamente indirizzata alla struttura e ai contenuti e manovrandola poi esclusivamente con i CSS per impaginarla. Con la comparsa di Internet Explorer 5, di Firefox e di Opera 7, i CSS 2 hanno potuto avvalersi di browser in grado di interpretarli e sono quindi entrati a far parte del codice di molti siti web.

CSS 3

Le specifiche CSS 3 non sono state ancora pubblicate, sebbene il W3C pubblichi costantemente informazioni sulle novità in fase di sviluppo. I CSS 3 dovrebbero presentare soluzioni per la correzione di alcuni bug di interpretazione di Internet Explorer[senza fonte], migliorie nella gestione degli sfondi e una soluzione per realizzare i bordi arrotondati la cui realizzazione affligge i webdesigner da tempo.