जानिए CSS Grid के साथ काम करने वाले CSS गुण कैसे काम करते हैं

यदि आप वेब डिज़ाइन तकनीक से जुड़े रहते हैं तो आपको CSS ग्रिड के बारे में पता होना चाहिए। ये गुण हैं CSS3 प्रारूप में नए जोड़ और वे जल्दी से एक डेवलपर का सबसे अच्छा दोस्त बन रहे हैं.

हमने हाल ही में CSS ग्रिड गुणों को सीखने में आपकी मदद करने के लिए एक मजेदार गेम कवर किया है, लेकिन गेम हमेशा व्यावहारिक विचारों को नहीं सिखाते हैं। यह वह जगह है जहाँ ग्रिड अधिक उपयोगी हो सकता है.

यह मुफ्त वेबप आपको देता है वास्तविक समय में ग्रिड को अनुकूलित करें और लाइव स्निपेट्स को अपडेट करें पेज पर। आप कॉलम, गटर और मार्जिन को परिभाषित करके अपने स्वयं के कस्टम ग्रिड के साथ गड़बड़ कर सकते हैं, और ग्रिड के काम करने के तरीके को जानने के लिए पृष्ठ का पुनर्गठन कर सकते हैं।.

ग्रिडिड वास्तव में एक है फ्री लर्निंग टूल फ्रंटएंड डेवलपर्स के लिए बनाया गया है जो सीएसएस ग्रिड के बारे में अधिक समझना चाहते हैं.

इस वेबएप के साथ आप ग्रिड में नए आइटम जोड़ सकते हैं, अन्य आइटम हटा सकते हैं, और उन्हें किसी भी लेआउट को फिट करने के लिए आकार बदल सकते हैं.

ग्रिड गुणों के संपादन के लिए वेबैप में अलग-अलग इनपुट फ़ील्ड के साथ अलग-अलग अनुभाग हैं। ये आपको ग्रिड पंक्तियों / स्तंभों का सुधार करने देते हैं और वे आपको सिखाते हैं वास्तव में आप क्या कर रहे हैं जिस तरह से साथ.

आप स्तंभ अंतराल को परिभाषित कर सकते हैं, ग्रिड आइटम संरेखित कर सकते हैं और औचित्य सेटिंग्स के साथ खेल सकते हैं - ये सभी फॉर्म फ़ील्ड के माध्यम से। जब भी आप कोई बदलाव करते हैं तो यह पूर्वावलोकन और छोटे कोड स्निपेट को स्वतः अपडेट कर देगा.

इस तरह से आप बस CSS को अपने स्टाइलशीट में कॉपी और पेस्ट कर सकते हैं यदि आप इसके साथ और गड़बड़ करना चाहते हैं। बहुत अच्छा!

ग्रिड गार्डन जितना मजेदार नहीं हो सकता लेकिन ग्रिड सीखना और सीखने का एक व्यावहारिक तरीका है नेत्रहीन समझते हैं CSS ग्रिड गुण पृष्ठ तत्वों को कैसे प्रभावित करते हैं.

इसके साथ खेलने के लिए बस ग्रिड होमपेज पर जाएं। आप ट्विटर @drewisthe पर रचनाकार के साथ अपने विचार या प्रश्न भी साझा कर सकते हैं.