Επιλογή στοιχείου με πολλαπλές κλάσεις στο CSS

Αν θέλουμε, μπορούμε να επιλέξουμε ένα στοιχείο που έχει ταυτόχρονα δύο κλάσεις, χωρίς να επηρεάσουμε στοιχεία με μία μόνο από αυτές τις κλάσεις.

Ας δούμε ένα παράδειγμα. Ας υποθέσουμε ότι έχουμε τον ακόλουθο κώδικα:

<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>

Όπως βλέπετε, η πρώτη παράγραφος έχει την κλάση eee, η δεύτερη παράγραφος - την κλάση zzz, και η τρίτη παράγραφος - και τις δύο κλάσεις ταυτόχρονα.

Ας επιλέξουμε την τελευταία παράγραφο, χωρίς να επηρεάσουμε τις υπόλοιπες. Για να το κάνουμε αυτό, γράφουμε συνεχόμενα χωρίς κενό το όνομα της μιας κλάσης και το όνομα της δεύτερης κλάσης:

.eee.zzz {
	color: red;
}

Επιλέξτε το στοιχείο που έχει ταυτόχρονα τις κλάσεις eee, zzz και ccc:

<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>