[CSS] Selettori

[CSS] Selettori

  giugno 27, 2014    portaletecnologico

---

Un selettore è è una dichiarazione utile a selezionare gli elementi di un documento a cui applicare una regola che costituirà lo stile del documento stesso.

E' possibile raggruppare due o più selettori che vanno separati da una virgola, evitando così di applicare una regola per ogni selettore:

h1, h2, h3, h4 {background: black;}

➙ Universal selector (selettore universale)

Con il selettore universale vengono selezionati tutti gli elementi di un documento. Viene espresso con l'asterisco * :

* {color: black;}

➙ Descendant selector (selettore del discendente)

Un elemento viene detto discendente quando un altro elemento è contenuto nel suo interno. Il selettore discendente seleziona questo tipo di elementi:

div p {color: black;}  (vengono qua selezionati tutti i paragrafi <p> con elementi discendenti <div>)

p strong  (vengono qua selezionati tutti gli elementi <strong> che si trovano all'interno di un paragrafo)

➙ Adjacent-sibling selector (selettore dell'elemento adiacente)

Selettore che serve a selezionare gli elementi adiacenti ad un altro. La relazione viene espressa con il segno +

Per esempio, se vogliamo attribuire il colore nero sia al titolo che al primo paragrafo di un documento

<h1>Titolo</h1>

<p>Paragrafo1</p>

la relazione sarà:

h1+p {color: black;}

L'applicazione non sarà valida per gli altri paragrafi a seguire dato che questo tipo di selettore relaziona solo gli elementi vicini, prossimi ad un altro.

Questo selettore non è riconosciuto da Explorer.

➙ Attribute selector (selettore dell'attributo)

Vengono selezionati gli elementi in base ai loro attributi e valori.

Questo tipo di selettore si può usare in quattro modi:

- attributo semplice, dove vengono selezionati tutti gli elementi che presentano un attributo.

- attributo con valore, dove vengono selezionati tutti gli elementi che presentano un valore dell'attributo con una stringa definita nella regola.

- attributo con valore che contiene una stringa, dove vengono selezionati tutti gli elementi con il valore dell'attributo dichiarato in una stringa.

-attributo il cui valore inizia o finisce con una stringa, dove vengono selezionati tutti gli elementi in cui il valore dell'attributo inizia o finisce con una stringa dichiarata nella regola.