Fondamenti dei CSS

L'XHTML consiste nella riformulazione del vocabolario dell' HTML, inteso come una applicazione dell' XML, che è a sua volta un' applicazione dell' SGML.

L' XML può essere definito come una via di mezzo tra l' HTML e l' SGML, in quanto garantisce la semplicità di codifica del primo e al tempo stesso fornisce la potenza e la flessibilità del secondo.

Il Web, in futuro, sarà codificato in XML, perciò il W3C ha interrotto lo sviluppo dell'HTML, raccomandando l'XHTML.
Questo passaggio consentirà ai documenti pubblicati oggi di essere compatibili con il Web di domani.

Prima di iniziare a compilare i CSS è necessario sapere come il browser li applica alle pagine XHTML.
Per i CSS sono fondamentali i seguenti concetti: elemnti block e inline, l' ereditarietà e la concatenazione, e il modello a gabbie. Tutto questo insieme costituisce il come che viene applicato al cosa dei nostri CSS.

Se si dispone di altri browser, oltre ad Internet Explorer, si potranno verificare differenze di interpretazione per le pagine di esempio; questo perchè i browser hanno dei "difetti" che costringono ad esprimere in maniera differente alcune regole dei CSS. Durante il corso, saranno illustrate le varie "reazioni" che i CSS hanno con i diversi browser.

Elementi Block e Inline

Gli elementi a livello di blocco (block-level) cominciano sempre su una nuova riga.
Alcuni block-level sono, per esempio, il tag <p> e il tag <h1>.
I block-level possono contenere altri block-level, così come elementi inline.

Gli elementi inline, invece, si estendono come le lettere che state leggendo di questa frase e iniziano una nuova riga quando hanno raggiunto il lato destro della finestra; cioè quando hanno "riempito" lo spazio precedente.

Esempio di elementi inline sono il tag <em> e il tag <a>. Gli elementi inline possono contenere solo altri elementi inline. Gli stili possono essere applicati a uno qualunque degli elementi esistenti nel codice. Quando si vuole applicare uno stile ad una sezione non definita da un elemento, è possibile crearne una nuova con i tag <div> e <span>. L' elemento <div> si usa per gli elementi di blocco, mentre <span> per gli elementi inline. Se si vuole, invece, applicare uno stile a certi elementi di <div> o <span>, si possono aggiungere gli attributi id e class come identificatori dei tag scelti. Ecco un esempio:

Senza una dichiarazione di stili, gli elementi <div> e <span> non avranno nessun effetto sulla visualizzazione nel browser. Possiamo vedere una pagina di esempio. Nella prossima lezione si applicheranno delle dichiarazioni di stile agli elementi.