सीएसएस नेस्टिंग के लिए सिंटैक्स चुनने में मदद करना

सीएसएस नेस्टिंग के सिंटैक्स को चुनने में मदद करने के लिए, पिछले सर्वे को चलाने के बाद, सीएसएस वर्किंग ग्रुप ने सीएसएस में नेस्टिंग को तय करने के सबसे सही तरीके पर बहस जारी रखी. चर्चाओं के दौरान, सिंटैक्स के नए आइडिया सुझाए गए थे. इनमें से किसी भी सिंटैक्स को चुनने में वर्किंग ग्रुप की मदद करने के लिए, एक नया सर्वे किया जा रहा है.

विकल्प

पिछले सर्वे के नतीजों के आधार पर, पहले और दूसरे विकल्प पर अब विचार नहीं किया जा रहा है. दो नए विकल्प (चार और पांच) जोड़े गए हैं.

पांचवां विकल्प: टॉप-लेवल नेस्टिंग कंटेनर

टॉप-लेवल @nest नियम को शामिल किया गया है. इसमें एलान और नेस्ट किए गए कई स्टाइल नियमों वाला & { … } ब्लॉक शामिल है.

@nest selector {
  & {
    property: value;
  }
  nested-selector {
    property: value;
  }
}

चौथा विकल्प: पोस्टफ़िक्स का प्रस्ताव

नेस्ट किए गए नियमों वाला एक अतिरिक्त कोड ब्लॉक, मुख्य नियम के बाद डाला जाता है. इसमें एलान शामिल होते हैं.

selector {
  property: value;
} {
  nested-selector {
    property: value;
  }
}

तीसरा विकल्प: ऐसा प्रस्ताव जिसमें पत्र का इस्तेमाल न किया गया हो

नेस्ट किए गए हर नियम को साफ़ तौर पर समझा जा सके. इसके लिए, यह ज़रूरी है कि वह किसी सिंबल के साथ शुरू न हो. अगर आपको टाइप सिलेक्टर के साथ सिलेक्टर शुरू करना है, तो & div या :is(div) लिखें.

selector {
  property: value;
  & nested-selector {
    property: value;
  }
}

ऊपर दिए गए स्निपेट का इस्तेमाल, हर प्रस्ताव के बुनियादी पहलुओं को दिखाने के लिए किया जाता है. हालांकि, नए सर्वे में कई और उदाहरण शामिल किए गए हैं.

अपना वोट दें

अपना वोट डालने के लिए, https://webkit.org/blog/13607/ पर जाएं. वोट देने के लिए रजिस्ट्रेशन की ज़रूरत नहीं है. “पांचवां विकल्प”, “चौथा विकल्प” या “तीसरा विकल्प” चुनें और सबमिट करें पर क्लिक करें.

अपना वोट डालें!