La seconda parte della guida sulle regole dei CSS

Continua la mini guida sulle regole dei CSS.

Identificatori.

Gli identificatori servono a selezionare un elemento unico della pagina. Per associare un elemento a un identificatore e’ sufficiente specificarne il nome attraverso l’attributi ID:

Titolo

Testo





.......

Il selettore CSS corrispondente si realizza riportando il valore assegnato all’attributo ID, preceduto da un cancelletto (#):

#intestazione{...}

#corpo{...}

Bisogna ricordarsi che in ogni documento Html non possono esistere due elementi col medesimo valore per l’attributo ID.

L’identificatore puoì essere anche associato ad un specifico tipo di elemento e a piu’ classi, ovvero si possono combinare classi e identificatori.

HTML

...

CSS

div#intestazione{...}

div#corpo.areaTesto{...}

Selettori di attributo.

Non molto utilizzati, ma veramente utili, i selettori di attributo permettono di individuare un elemento in base ai suoi attributi e al valore ad essi assegnato.

• elm[att] verifica se l’attributo att dell’elemento elm e’ stato impostato

• elm[att=val] verifica se l’attributo att dell’elemento elm assume esattamente il valore val

Pseudo-classi.

Le pseudo-classi creano delle distinzioni nei diversi stati di uno stesso elemento.

Le solo pseudo-classi supportate dai browser piu’ diffusi sono:

• a:link identifica un link ancora non visitato
• a:visited identifica un link gia’ visitato
• a:hover identifica un link sopra il quale e’ posizionato il mouse
• a:focus identifica un link che abbia ricevuto il focus
• a:active identifica un link durante l’attivazione da parte dell’utente

Pseudo-elementi.

Gli pseudo-elementi selezionano una sotto parte di un dato elemento.

Esempio:

HTML

I Web Designer e' un bel blog

CSS

p:first-letter{

font-size:50px;

}

p:first-line{

font-style:italic;

}

Ecco il risultato di quanto illustrato: