आज ही कंटेनर प्रश्नों का प्रयोग करें

जब से रिस्पॉन्सिव वेब डिज़ाइन आया है, डेवलपर्स DOM तत्वों को उनके वास्तविक आकार के आधार पर डिज़ाइन करने की संभावना के बारे में पूछ रहे हैं, न कि ब्राउज़र में व्यूपोर्ट के आकार पर ( मीडिया प्रश्नों की सहायता से)। वास्तव में, कंटेनर क्वेश्चन (आरंभ में एलिमेंट क्वेश्चन) संभवत: सबसे अधिक अनुरोध किया जाने वाला सीएसएस फ़ंक्शन है जो ब्राउज़र के पास अभी भी नहीं है


पहले से ही कई , कई , कई पोस्ट हैं जो बताती हैं कि सीएसएस में कंटेनर प्रश्नों को लागू करना मुश्किल क्यों है और ब्राउज़र निर्माता उन्हें लागू करने में संकोच क्यों कर रहे हैं। यदि आप अभी इसका आनंद लेना चाहते हैं, तो थोड़ी जावास्क्रिप्ट मदद कर सकती है:

c51c33e1533e68c3f8fd24633700789f

तब पूरी बात इस तरह दिखती है:

See the Pen by David Vielhuber (@vielhuber) on CodePen.

ब्रेकप्वाइंट , चयनकर्ता और शैली विशेषताओं का उपयोग विभिन्न ब्रेकप्वाइंट, स्वचालित चयनकर्ता और जोड़े गए वर्गों के प्रकार को परिभाषित करने के लिए किया जा सकता है। यदि आप स्क्रिप्ट का उपयोग कर रहे हैं, तो आप नव निर्मित कक्षाओं को निम्नानुसार संबोधित कर सकते हैं:

c51c33e1533e68c3f8fd24633700789f

ओवरले, पॉपअप, साइडबार या कस्टम तत्वों में तत्वों के लिए कंटेनर प्रश्नों का उपयोग विशेष रूप से सार्थक है - अब भी, उदाहरण के लिए, ऊपर की स्क्रिप्ट के साथ।

वापस