Più selettori uniti in CSS
Per selezionare un elemento che soddisfa contemporaneamente più selettori, è necessario scrivere questi selettori uniti, senza spazi.
Ad esempio, il seguente selettore selezionerà un elemento
che ha contemporaneamente la classe bbb e la classe
zzz:
.bbb.zzz {
}
Il seguente selettore selezionerà un'intestazione h2,
che ha contemporaneamente la classe bbb e la classe
zzz:
h2.bbb.zzz {
}
In questo modo è possibile costruire combinazioni arbitrarie di selettori. L'ordine dei selettori utilizzati non ha importanza, tranne per la regola che i selettori di tag devono essere posizionati all'inizio.
Cioè, ad esempio, i selettori .bbb.zzz
e .zzz.bbb sono completamente equivalenti.
Inoltre, è possibile formare selettori
utilizzando id, ad esempio:
#elem.eee, o h2#elem.eee,
o h2.eee#elem e così via.
Spiega cosa seleziona il selettore nel codice riportato di seguito. Quindi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
.bbb.zzz {
color: red;
}
Spiega cosa seleziona il selettore nel codice riportato di seguito. Quindi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
h2.bbb.zzz {
color: red;
}
Spiega cosa seleziona il selettore nel codice riportato di seguito. Quindi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
#elem.bbb {
color: red;
}
Spiega cosa seleziona il selettore nel codice riportato di seguito. Quindi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
#elem.bbb.zzz {
color: red;
}
Spiega cosa seleziona il selettore nel codice riportato di seguito. Quindi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
h2#elem.bbb {
color: red;
}
