Kichagua Kizazi katika CSS

Acha tuwe na orodha ya ul na orodha ya ol:

<ul>
	<li>maandishi</li>
	<li>maandishi</li>
	<li>maandishi</li>
	<li>maandishi</li>
	<li>maandishi</li>
</ul>
<ol>
	<li>maandishi</li>
	<li>maandishi</li>
	<li>maandishi</li>
	<li>maandishi</li>
	<li>maandishi</li>
</ol>

Wacha tuweke rangi ya vitambi li katika orodha hizi kuwa nyekundu:

li {
	color: red;
}

Acha sasa tuitake kuweka rangi ya vitambi li za orodha ya ul kuwa nyekundu, na vitambi li za orodha ya ol - kuwa kijani.

Katika hali hii, kichagua kizazi kitatusaidia. Kinakuwezesha kuchagua vitambi kulingana na mzazi wake. Ili kufanya hivyo, unahitaji kubainisha kichagua cha mzazi, na kwa nafasi - kichagua cha kizazi. Katika kesi yetu kichagua ul li kitachagua vitambi vyote li kutoka kwenye orodha ya ul, na kichagua ol li - kitachagua vitambi vyote li kutoka kwenye orodha ya ol. Tuwaweke rangi katika rangi zinazohitajika:

ul li {
	color: red;
}
ol li {
	color: green;
}

Kichagua kizazi si lazima kiwe na vichagua viwili vya vitambi - inaweza kuwa na idadi yoyote, iliyoandikwa kwa nafasi. Katika msimbo ufuatao, kwa mfano, vinachaguliwa vitambi vyote i, vilivyo ndani ya kitambi li, ambayo yenyewe iko ndani ya kitambi ul:

ul li i {
	color: red;
}

Msimbo ufuatao umetolewa:

<ul>
	<li>maandishi <i>italiki</i></li>
	<li>maandishi <i>italiki</i></li>
	<li>maandishi <i>italiki</i></li>
	<li>maandishi <i>italiki</i></li>
</ul>

<p>
	maandishi ya aya <i>italiki</i>
</p>
<p>
	maandishi ya aya <i>italiki</i>
</p>

Weka rangi nyekundu kwa herufi italic kutoka kwenye vitambi ul, na kwa rangi ya kijani - herufi italic kutoka kwenye vitambi p.

Msimbo ufuatao umetolewa:

<p>
	maandishi ya aya <b><i>italiki nzito</i></b>
</p>
<p>
	maandishi ya aya <i>italiki</i>
</p>

Weka rangi nyekundu kwa herufi italic, zilizo ndani ya kitambi b, ambacho kwa upande wake kiko ndani ya kitambi p.