Errore nell'utilizzo di più selettori CSS
Ricordo l'errore dei principianti: il selettore
.bbb.zzz e il selettore .bbb .zzz
fanno cose diverse. Il primo cerca un elemento
che ha entrambe le classi contemporaneamente, mentre il secondo
- cerca un elemento con la classe zzz, che si trova
all'interno di un elemento con la classe bbb.
Spiega cosa seleziona il selettore nel codice qui sotto. Poi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
h2.zzz {
color: red;
}
Spiega cosa seleziona il selettore nel codice qui sotto. Poi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
h2 .zzz {
color: red;
}
Spiega cosa seleziona il selettore nel codice qui sotto. Poi 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 qui sotto. Poi 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 qui sotto. Poi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
.bbb.zzz.xxx {
color: red;
}
Spiega cosa seleziona il selettore nel codice qui sotto. Poi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
.bbb .zzz.xxx {
color: red;
}
Spiega cosa seleziona il selettore nel codice qui sotto. Poi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
.bbb.zzz .xxx {
color: red;
}
Spiega cosa seleziona il selettore nel codice qui sotto. Poi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
.bbb .zzz .xxx {
color: red;
}
Spiega cosa seleziona il selettore nel codice qui sotto. Poi 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 qui sotto. Poi scrivi il codice HTML adatto a questo selettore. Ecco il codice con il selettore:
#elem .bbb {
color: red;
}