Barnevelger i CSS
La oss ha følgende kode:
<p>
tekst <b><i>fet kursiv</i></b>
</p>
<p>
tekst <i>bare kursiv</i>
</p>
La oss si at vi vil velge alle i-taggene
som er etterkommere av avsnitt. La oss gjøre det:
p i {
color: red;
}
Resultat av kjøring av koden:
La oss nå velge de i-taggene
som er direkte barn
av våre avsnitt. Barnevelgeren >
vil hjelpe oss med dette.
For å forstå hvordan du bruker den, la oss
sammenligne den med etterkommervelgeren. Slik:
p i - vi vil velge all kursiv inni
avsnitt, og slik: p > i - bare
kursiv som er direkte barn av avsnitt.
La oss bruke denne velgeren på HTML-koden vår:
p > i {
color: red;
}
Resultat av kjøring av koden:
Følgende kode er gitt:
<ul>
<li>
<i>kursiv</i>
<b>fet</b>
<b><i>fet kursiv</i></b>
</li>
<li>
<i>kursiv</i>
<b>fet</b>
<b><i>fet kursiv</i></b>
</li>
</ul>
Farg bare de b-taggene i rødt
som er direkte barn av
li-taggene.