Selettore di discendenti e classi in CSS
Supponiamo di avere il seguente codice:
<div class="block">
<h2>Title</h2>
<p>
text
</p>
</div>
<div class="block">
<h2>Title</h2>
<p>
text
</p>
</div>
Selezioniamo tutti i titoli h2 e
i paragrafi all'interno dell'elemento con classe
block, e coloriamoli con colori diversi.
Usiamo per questo il selettore di discendenti (che è
lo spazio tra i selettori):
.block h2 {
color: red;
}
.block p {
color: green;
}
È dato il seguente codice:
<p class="eee">
text <i>italic</i>
</p>
<p class="eee">
text <i>italic</i>
</p>
<div class="eee">
text <i>italic</i>
</div>
<div class="eee">
text <i>italic</i>
</div>
Colorate in rosso tutti i tag i,
che si trovano negli elementi con classe eee.