CSS හි දරුවා තෝරන්නා

දරුවා තෝරන්නා > එකිනෙකාට කෙලින්ම කාවැද්දී ඇති මූලිකයන් තෝරා ගැනීමට ඉඩ සලසයි.

වාක්‍ය රචනය

cssතෝරන්නා1 > තෝරන්නා2 {
  
}

උදාහරණය

අපි p ටැග් ඇතුළත කෙලින්ම පිහිටා ඇති සියලුම b ටැග් වෙත හැරෙමු, ඒවා රතු පාට කරමු:

html<p>
  text <b>+</b>
</p>
<p>
  text <i><b>-</b></i>
</p>

cssp > b {
  color: red;
}

Результат:

උදාහරණය

.block පන්තියේ මූලිකයන් ඇතුළත කෙලින්ම පිහිටා ඇති සියලුම b ටැග් වෙත අපි හැරෙමු, ඒවා රතු පාට කරමු:

html<p class="block">
  text <b>+</b>
</p>
<p class="block">
  text <i><b>-</b></i>
</p>
<p>
  text <b>-</b>
</p>

css.block > b {
  color: red;
}

Результат:

උදාහරණය

.block පන්තියේ මූලිකයන් ඇතුළත කෙලින්ම පිහිටා ඇති .elem පන්තියේ සියලුම මූලිකයන් වෙත අපි හැරෙමු, ඒවා රතු පාට කරමු:

html<p class="block">
  text <span class="elem">+</span>
</p>
<p class="block">
  text <i><span class="elem">-</span></i>
</p>
<p class="block">
  text <span>-</span>
</p>
<p>
  text <span class="elem">-</span>
</p>

css.block > .elem {
  color: red;
}

Результат:

මෙයද බලන්න