Jälkeläisvalitsija ja luokat CSS:ssä
Oletetaan, että meillä on seuraava koodi:
<div class="block">
<h2>Otsikko</h2>
<p>
teksti
</p>
</div>
<div class="block">
<h2>Otsikko</h2>
<p>
teksti
</p>
</div>
Valitaan kaikki otsikot h2 ja
kappaleet, jotka sijaitsevat luokan
block elementin sisällä, ja väritetään ne eri väreihin.
Käytetään tähän jälkeläisvalitsijaa (mikä on
väli selektoreiden välillä):
.block h2 {
color: red;
}
.block p {
color: green;
}
Annettu seuraava koodi:
<p class="eee">
teksti <i>kursivoitu</i>
</p>
<p class="eee">
teksti <i>kursivoitu</i>
</p>
<div class="eee">
teksti <i>kursivoitu</i>
</div>
<div class="eee">
teksti <i>kursivoitu</i>
</div>
Värjää punaiseksi kaikki i -tagit,
jotka sijaitsevat luokan eee elementeissä.
