I Selettori CSS


HTML

<p id = "speciale">



</p>



CSS

completa

p#speciale {color:yellow;}


la scrittura abbreviata CSS

#speciale {color:yellow;}


per applicare una sola regola a più selettori

scrivete i selettori separati da virgola


h1, h2
{color: purple;
}


per fare una classe


.forte {font-weight:bold;
}



in html la scrittura

<a href="#">prova</a> è il link a se stesso



Selettore di elementi (type selector)

È il più semplice dei selettori. È costituito da uno qualunque degli elementi di (X)HTML.
Sintassi
h1 {color: #000000;}
p {background: white; font: 12px Verdana, arial, sans-serif;}
table {width: 200px;}

Raggruppare

È possibile nei CSS raggruppare diversi elementi al fine di semplificare il codice. Gli elementi raggruppati vanno separati da una virgola.

h1, h2, h3 {color: red;}


Selettore universale (universal selector)

Anche nei CSS abbiamo un jolly. Il selettore universale serve a selezionare tutti gli elementi di un documento. Si esprime con il carattere * (asterisco).
Sintassi
  • { color: black; }


Selettore del discendente (descendant selector)

Nella specifica CSS1 questo tipo era definito "selettore contestuale". Serve a selezionare tutti gli elementi che nella struttura ad albero di un documento siano discendenti di un altro elemento specificato nella regola. Ricordiamo che un elemento è discendente di un altro se è contenuto al suo interno, a qualsiasi livello.
Sintassi
div p {color: black;}
p strong {color: red;}
Alcune considerazioni importanti di cui tenere conto. Il selettore va letto per chiarezza da destra a sinistra. Nel primo esempio verranno selezionati tutti i paragrafi (<p>) discendenti di elementi <div>. Nel secondo tutti gli elementi <strong> che si trovino all'interno di un paragrafo.
Fate attenzione alla struttura del documento ed evitate possibili incongruenze. Esistono regole ben precise sull'annidamento degli elementi che vanno rispettate sia in (X)HTML che nei CSS.





elenco completo

http://css.flepstudio.org/css-proprieta/selettori-css.html