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

एडम आर्गाइल
एडम आर्गाइल

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

विकल्प

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

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

यह टॉप-लेवल @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/ पर जाकर अपना वोट देने के लिए. वोट देने के लिए रजिस्ट्रेशन की ज़रूरत नहीं है. इसके बाद, “पांचवां विकल्प”, “चौथा विकल्प” या “तीसरा विकल्प” चुनें और 'सबमिट करें' पर क्लिक करें.

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