Ετικέτα με δεδομένη κλάση στο CSS

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

<h2 class="eee">Τίτλος</h2>
<p class="eee">
	κείμενο
</p>

<h2 class="eee">Τίτλος</h2>
<p class="eee">
	κείμενο
</p>

Μπορούμε, για παράδειγμα, να χρωματίσουμε όλα τα στοιχεία με αυτήν την κλάση σε κόκκινο χρώμα:

.eee {
	color: red;
}

Ωστόσο, μπορούμε να απευθυνθούμε σε μια συγκεκριμένη ετικέτα με κλάση. Για παράδειγμα, μπορούμε να επιλέξουμε όλα τα h2 με κλάση eee και ξεχωριστά να επιλέξουμε όλες τις p με αυτήν την κλάση.

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

h2.eee {
	color: red;
}
p.eee {
	color: green;
}

Δίνεται ο ακόλουθος κώδικας:

<h2 class="header">κείμενο</h2>
<h2 class="header">κείμενο</h2>
<h3 class="header">κείμενο</h3>
<h3 class="header">κείμενο</h3>

.header {
	color: red;
}

Κάντε όλα τα h2 με κλάση header μεγέθους 40px, και όλα τα h3 με αυτήν την κλάση - μεγέθους 30px.