Sintassi delle regole Css – 2

Come visto in Sintassi delle regole Css abbiamo visto che una regola Css è composta da:

  1. Selettore
  2. Lista dichiarazioni

Ciascuna dichiarazione è a sua volta scomponibile in

  1. Proprietà
  2. Valore

Ora ci manca di definire cos’è un selettore, molto brutalmente un selettore può essere:

  1. Un tag dell’HTML
  2. Una classe
  3. Un identificatore

Inoltre esiste il selettore speciale * che applica le proprietà definite dalla regola a tutti gli elementi HTML.

I tag dell’HTML dovrebbero essere abbastanza noti, quando il selettore è un tag basta scrivere solamente il suo nome ad esempio:

body{}
p{}
td{}
a{}

Per quanto riguarda le classi, si può dire che si utlizzano quando dobbiamo definire insiemi di oggetti omogenei, cioè con un po’ di approssimazione elementi che si ripetono più volte all’interno della stessa pagina, come ad esempio delle notizie o dei paragragi di descrizione. La definizione di una classe Css è la seguente:

.notizia{
     color:#000;
     font-size:12px;
}
.secondaClasse{}

L’applicazione della classe nella HTML è la seguente

...

Riassumendo la dichiarazione di una classe nei Css avviene mediante l’utilizzo del . (punto), in pratica tutto quello che inizia con un punto è una classe.
Per utilizzare un classe nell’HTML basta utilizzare l’attributo class=”nomeClasse” all’interno del tag che ci interessa.

Fate attenzione la dichiarazione nel css inizia col punto, la chiamata nell’HTML è uguale al nome della classe ma senza punto!

Per quanto riguarda gli identificatori la dichiarazione nel foglio di stile avviene tramite l’utilizzo di # (cancelletto), vediamo un esempio:

#primoId{
     color:#ffee00;
     font-size:10px;
}
.secondId{}

L’utilizzo nell’HTML avviene tramite l’attributo id=”Id”, per esempio per utilizzare primoId basterà scrivere:

...

Anche qui bisogna fare attenzione, nei css la dichiarazione inizia con #, nell’HTML la chiamata è senza #. Un’altra cosa a cui prestare attenzione è l’unicità dell’identificatore, secondo definizione un identificatore non dovrebbe essere chiamato più volte in una pagina, ma se lo fate non ottenete nessun problema di formattazione.