iShadeed की कंटेनर क्वेरी लैब

अहमद शदीद ने कंटेनर प्रश्नों पर शुरुआती छलांग लगाई और एक उदाहरणों का बढ़ता संग्रह रोजमर्रा के पैटर्न के आधार पर।

और, यदि आप चूक गए, तो उसका कंटेनर प्रश्नों पर नवीनतम पोस्ट इस महीने क्रोम 105 में उतरने के बाद से वे कैसे काम करते हैं, यह कवर करने के लिए एक अद्भुत काम करता है (हम उन्हें जल्द ही सफारी 16 में देखेंगे)। कुछ विकल्प हाइलाइट और टेकअवे:

• कंटेनरों को के साथ परिभाषित किया गया है container-type संपत्ति। पिछले डेमो और प्रस्तावों का उपयोग किया जा रहा था contain बजाय.
• कंटेनर क्वेश्चन काफी हद तक मीडिया क्वेश्चन की तरह हैं जिन्हें हम व्यूपोर्ट साइज को लक्षित करने के लिए लिख रहे हैं। तो, कुछ पसंद करने के बजाय @media (min-width: 600px) {}, हमारे पास है @container (min-width: 600px) {}. इससे उन मीडिया प्रश्नों में से कई को कंटेनर प्रश्नों में परिवर्तित करना चाहिए, जो नए ब्रेकपॉइंट मानों को समझने का काम घटाकर काफी सीधे हैं।
• हम कंटेनरों को अपने कोड में अलग करने में मदद करने के लिए नाम दे सकते हैं (जैसे container-name: blockquote).

बढ़िया काम, अहमद! और साझा करने के लिए धन्यवाद!

सीधा लिंक →