Prefazione


Sono ormai divenuti molto comuni sul web.
Tecnica che permette di fissare gli stili (per es. tipo di carattere, colori e spaziature)
da applicare ai documenti Web tipo HTML e XHTML.

>Standardizzazione curata da W3C (http://www.w3c.org)
> 1996, CSS1: servono per modificare l?aspetto degli elementi nelle pagine HTML (colore, dimensione, ?)
> 1998, CSS2: permettono funzioni più sofisticate e
introducono la possibilità di posizionamento assoluto per gli elementi nelle pagine HTML

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
Copyright (c) 2010 ilcorsaronero. All rights reserved.