Introduzione
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 trasferito su un codice completamente separato, il CSS appunto.
I richiami tra i due codici venivano effettuati tramite due particolari attributi: class e ID.
CSS 2
Per includere 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.
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 rilasciate.
Introduzione al layout a colonna singola, due e tre colonne.
L'impaginazione è uno degli aspetti fondamentali di un sito internet.
Perche i fogli di stile ?
i fogli di stile garantiscono una migliore separazione tra contenuti e presentazione e quindi:
> | alleggerimento del codice html |
> |
aumento della velocità di caricamento |
> |
minori spese per la banda |
> |
restyling e modifiche di layout sono molto più semplici per un sito ben strutturato
|
> | migliore accessibilità e visibilità verso media alternativi: |
| palmari, cellulari, screen readers, text browsers e stampanti |
La definizione più conosciuta e diffusa dei fogli di stile è: sono la separazione tra contenuto e presentazione.
Il contenuto è nella pagina html, mentre la presentazione è riservata ai fogli di stile.
Un layout table-less si realizza attraverso l'uso dei div. La sua definizione è generic block-level element ossia contenitore generico.
Esso può contenere qualsiasi elemento HTML.
Ecco i principali layout che vedremo in questa guida:
> | Layout monolitico o a colonna singola |
> |
Layout a due colonne |
> |
Layout a tre colonne |
Per ogni layout, ci sono tre principali categorie a seconda della sua estensione orizzontale:
> | Layout fisso |
> |
Layout fluido |
> |
Layout elastico |
Vantaggi
> | Permettono di modificare il look & feel di un documento in modo efficiente |
> |
Lo stesso stile può essere applicato a più documenti |
> |
Il sorgente HTML è più pulito |
> | Si possono progettare le pagine HTML per più browser |