Selezione di elementi per classe multipla in CSS

Se lo desideriamo, possiamo selezionare un elemento che ha due classi contemporaneamente, senza intaccare gli elementi con una sola di queste classi.

Diamo un'occhiata a un esempio. Supponiamo di avere il seguente codice:

html<p class="eee">
  This is a paragraph with text.
</p>
<p class="zzz">
  This is a paragraph with text.
</p>
<p class="eee zzz">
  This is a paragraph with text.
</p>

Come puoi vedere, il primo paragrafo ha la classe eee, il secondo paragrafo - la classe zzz, e il terzo paragrafo - entrambe le classi contemporaneamente.

Selezioniamo l'ultimo paragrafo, senza intaccare gli altri. Per fare questo, scriviamo senza spazi il nome di una classe e il nome della seconda classe:

css.eee.zzz {
  color: red;
}

html<p class="eee">
  This is a paragraph with text.
</p>
<p class="zzz">
  This is a paragraph with text.
</p>
<p class="ccc">
  This is a paragraph with text.
</p>
<p class="eee zzz ccc">
  This is a paragraph with text.
</p>