Manuale di riferimento dei selettori CSS

Selettore CSS

I selettori CSS vengono utilizzati per "trovare" (o selezionare) gli elementi HTML che si desidera stilizzare.

Usa il nostro test del selettore CSS per dimostrare diversi selettori.

Selettore semplice CSS

I selettori semplici selezionano gli elementi in base al nome dell'elemento, id e classe. Inoltre, ci sono selettori universali (*)

Selettore Esempio Descrizione dell'esempio
elemento p Seleziona tutti gli elementi <p>.
#id #firstname Seleziona l'elemento con id="firstname".
* * Seleziona tutti gli elementi.
.class .intro Seleziona tutti gli elementi con class="intro".

Selettore di attributo CSS

Gli selettori di attributo selezionano gli elementi HTML con un set di attributi dati.

Selettore Esempio Descrizione dell'esempio
[attribute] [target] Seleziona tutti gli elementi con l'attributo target.
[attribute=value] [target=_blank] Seleziona tutti gli elementi con l'attributo target="_blank".
[attribute~=value] [title~=flower] Seleziona tutti gli elementi con l'attributo title che contiene la parola "flower".
[attribute|=value] [lang|=en] Seleziona tutti gli elementi con valore dell'attributo lang che inizia con "en".
[attribute^=value] a[href^="https"] Seleziona ogni elemento <a> che ha l'attributo src che inizia con "https".
[attribute$=value] a[href$=".pdf"] Seleziona ogni elemento <a> che ha l'attributo src che termina con ".pdf".
[attribute*=value] a[href*="codew3c"] Seleziona ogni elemento <a> che contiene la sottostringa "abc" nel valore dell'attributo href.

Selettore di selezione annidato CSS

Selettore Esempio Descrizione dell'esempio
& & Applicare uno stile all'elemento in contesto di un altro elemento