LESS में नेस्टिंग के दौरान रिश्तेदारी सेलेक्टर्स
आइए देखें कि LESS में नेस्टिंग के दौरान विभिन्न सेलेक्टर्स कैसे जोड़ें, जो रिश्तेदारी के आधार पर तत्वों को चुनते हैं। उदाहरण देखें।
उदाहरण
चाइल्ड सेलेक्टर:
div {
> p {
color: red;
}
}
कम्पाइलेशन का परिणाम:
div > p {
}
उदाहरण
अडजासेंट सिबलिंग सेलेक्टर
div {
+ p {
color: red;
}
}
कम्पाइलेशन का परिणाम:
div + p {
}
उदाहरण
जनरल सिबलिंग सेलेक्टर:
div {
~ p {
color: red;
}
}
कम्पाइलेशन का परिणाम:
div ~ p {
}
प्रैक्टिकल टास्क्स
बताएं कि निम्नलिखित कोड की कम्पाइलेशन का परिणाम क्या होगा:
ul {
color: red;
> li {
padding: 20px;
}
}
बताएं कि निम्नलिखित कोड की कम्पाइलेशन का परिणाम क्या होगा:
div {
ul {
> li {
padding: 20px;
}
}
}