सीएसएस में चाइल्ड सेलेक्टर
मान लीजिए कि हमारे पास निम्नलिखित कोड है:
<p>
text <b><i>bold italic</i></b>
</p>
<p>
text <i>just italic</i>
</p>
मान लीजिए कि हम उन सभी i टैगों को चुनना चाहते हैं,
जो पैराग्राफ के वंशज हैं। आइए इसे करें:
p i {
color: red;
}
कोड निष्पादन का परिणाम:
आइए अब उन i टैगों को चुनें,
जो हमारे पैराग्राफ के सीधे वंशज हैं।
इसमें चाइल्ड सेलेक्टर > हमारी मदद करेगा।
यह समझने के लिए कि इसका उपयोग कैसे करें, आइए
इसकी तुलना वंशज सेलेक्टर से करें। इस तरह:
p i - हम पैराग्राफ के अंदर के सभी इटैलिक को चुनेंगे,
और इस तरह: p > i - केवल
वे इटैलिक जो पैराग्राफ के सीधे वंशज हैं।
आइए इस सेलेक्टर को हमारे HTML कोड पर लागू करें:
p > i {
color: red;
}
कोड निष्पादन का परिणाम:
निम्नलिखित कोड दिया गया है:
<ul>
<li>
<i>italic</i>
<b>bold</b>
<b><i>bold italic</i></b>
</li>
<li>
<i>italic</i>
<b>bold</b>
<b><i>bold italic</i></b>
</li>
</ul>
केवल उन b टैगों को लाल रंग में रंगें,
जो li टैगों के सीधे वंशज हैं।
