Tag con classe specificata in CSS
Supponiamo di avere due tipi di tag con le stesse
classi. Ad esempio, supponiamo che sia gli intestazioni h2,
che i paragrafi abbiano la stessa classe:
<h2 class="eee">Titolo</h2>
<p class="eee">
testo
</p>
<h2 class="eee">Titolo</h2>
<p class="eee">
testo
</p>
Possiamo, ad esempio, colorare tutti gli elementi con questa classe in rosso:
.eee {
color: red;
}
È possibile, tuttavia, fare riferimento a un tag specifico
con una classe. Ad esempio, si possono selezionare tutti i h2
con la classe eee e selezionare separatamente tutti i
p con questa classe.
Per fare ciò, nel selettore è necessario scrivere il nome
del tag, e poi unito il nome della classe. Facciamo,
ad esempio, colorare i h2 con la nostra classe
in rosso, e i paragrafi con questa classe
- in verde:
h2.eee {
color: red;
}
p.eee {
color: green;
}
È dato il seguente codice:
<h2 class="header">testo</h2>
<h2 class="header">testo</h2>
<h3 class="header">testo</h3>
<h3 class="header">testo</h3>
.header {
color: red;
}
Rendi tutti i h2 con la classe header
di dimensione 40px, e tutti i h3 con questa
classe - di dimensione 30px.