Virhe useiden CSS-valitsimien käytössä

Muistutan aloittelijoiden virheestä: valitsin .bbb.zzz ja valitsin .bbb .zzz tekevät eri asioita. Ensimmäinen etsii elementtiä, jolla on samanaikaisesti kaksi luokkaa, ja toinen - etsii elementtiä, jolla on luokka zzz, joka sijaitsee luokan bbb sisällä.

Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tämän valitsimen alle. Tässä on koodi valitsimella:

h2.zzz {
	color: red;
}

Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tämän valitsimen alle. Tässä on koodi valitsimella:

h2 .zzz {
	color: red;
}

Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tämän valitsimen alle. Tässä on koodi valitsimella:

.bbb.zzz {
	color: red;
}

Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tämän valitsimen alle. Tässä on koodi valitsimella:

.bbb .zzz {
	color: red;
}

Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tämän valitsimen alle. Tässä on koodi valitsimella:

.bbb.zzz.xxx {
	color: red;
}

Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tämän valitsimen alle. Tässä on koodi valitsimella:

.bbb .zzz.xxx {
	color: red;
}

Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tämän valitsimen alle. Tässä on koodi valitsimella:

.bbb.zzz .xxx {
	color: red;
}

Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tämän valitsimen alle. Tässä on koodi valitsimella:

.bbb .zzz .xxx {
	color: red;
}

Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tämän valitsimen alle. Tässä on koodi valitsimella:

#elem.bbb {
	color: red;
}

Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tämän valitsimen alle. Tässä on koodi valitsimella:

#elem .bbb {
	color: red;
}