Le regole CSS (prima parte)

Un CSS o foglio di stile, e’ un documento che raccoglie un insieme di regole di rappresentazione, le quali determinano l’aspetto delle diverse proprieta’ dei vari elementi della pagina a cui il foglio e’ associato.

Una regola e’ costituita, come in figura, da uno o piu’ selettori separati da un virgola (es. html, body) e da un insieme di dichiarazioni racchiuse tra parentesi graffe:

body{

background:#000;

margin:2px;

}

Il selettore serve a identificare l’oggetto della pagina a cui dare l’aspetto voluto.

L’insieme delle dichiarazioni definisce l’aspetto che il  browser dovra’ assegnare all’elemento indicato dal selettore; le singole dichiarazioni sono separate da un punto e virgola (;). Ogni dichiarazione e’ costituita da due elementi separati da due punti(:), la proprieta’ e il valore che si vuole assegnare alla proprieta’.

I selettori

I selettori indicano al browser a quali elementi della pagina si dovranno applicare le dichiarazioni inserite nella regola CSS. Per facilita’, a una stessa regola e’ possibile assegnare piu’ selettori, separati da una virgola:

p, h2,h3{..........}

Classi

Le classi servono a definire un insieme di oggetti omogenei. PEr associare un elemento ad una classe e’ sufficiente specificarne il nome attraverso l’attributo class:

Titolo

Testo....



Titolo

Testo....

Il selettore CSS corrispondente si realizza riportando il valore assegnato all’attributo class:

.articolo{...}

.articolo 1{...}

E’ anche possibile combinare due o piu’ classi:

.nomeClasse1{...}

.nomeClasse2{...}

.nomeClasse1.nomeClasse2{...}

La regola associata al selettore .nomeCLasse1.nomeClasse2 si applica a tutti gli elementi della pagina il cui attributo class assuma come valore due o piu’ stringhe, separate da uno spazio.