आप CSS में flex का उपयोग कैसे करते हैं?

2024 लेखक: Lynn Donovan | [email protected]. अंतिम बार संशोधित: 2024-01-18 08:24

सारांश

1. उपयोग प्रदर्शन: फ्लेक्स ; बनाने के लिए फ्लेक्स कंटेनर।
2. उपयोग औचित्य-सामग्री वस्तुओं के क्षैतिज संरेखण को परिभाषित करने के लिए।
3. उपयोग वस्तुओं के लंबवत संरेखण को परिभाषित करने के लिए संरेखित-आइटम।
4. फ्लेक्स का प्रयोग करें -दिशा यदि आपको पंक्तियों के बजाय स्तंभों की आवश्यकता है।
5. उपयोग आइटम ऑर्डर को फ़्लिप करने के लिए पंक्ति-रिवर्स या कॉलम-रिवर्स मान।

इसके बारे में CSS में display flex का क्या उपयोग है ?

ए फ्लेक्स कंटेनर उपलब्ध खाली स्थान को भरने के लिए वस्तुओं का विस्तार करता है या अतिप्रवाह को रोकने के लिए उन्हें सिकोड़ता है। सबसे महत्वपूर्ण बात, फ्लेक्सबॉक्स लेआउट नियमित लेआउट के विपरीत दिशा-अज्ञेयवादी है (ब्लॉक जो लंबवत-आधारित है और इनलाइन जो क्षैतिज-आधारित है)।

कोई यह भी पूछ सकता है कि CSS Flex 1 क्या है? फ्लेक्स : 1 ; = फ्लेक्स : 1 1 0एन; (जहां n एक लंबाई इकाई है)। फ्लेक्स -ग्रो: एक संख्या निर्दिष्ट करती है कि शेष लचीली वस्तुओं के सापेक्ष आइटम कितना बढ़ेगा। फ्लेक्स -श्रृंखला एक संख्या निर्दिष्ट करती है कि शेष लचीली वस्तुओं के सापेक्ष आइटम कितना सिकुड़ जाएगा। फ्लेक्स -आधार वस्तु की लंबाई।

इसके बाद, कोई यह भी पूछ सकता है कि इनलाइन फ्लेक्स सीएसएस क्या है?

इन - लाइन - फ्लेक्स - NS इन - लाइन का संस्करण फ्लेक्स तत्व और उसके बच्चों को होने की अनुमति देता है फ्लेक्स संपत्तियां जबकि दस्तावेज़/वेबपृष्ठ के नियमित प्रवाह में अभी भी शेष हैं। यह दस्तावेज़ प्रवाह के संदर्भ में एक ब्लॉक तत्व की तरह प्रतिक्रिया करता है। दो फ्लेक्सबॉक्स कंटेनर बिना अधिकता के एक ही पंक्ति में मौजूद नहीं हो सकते हैं स्टाइल.

फ्लेक्स कंटेनर के भीतर डिफ़ॉल्ट अभिविन्यास क्या है?

NS चूक जाना प्रदर्शन लागू करने के बाद व्यवस्था: फ्लेक्स वस्तुओं को मुख्य अक्ष के साथ बाएं से दाएं व्यवस्थित करने के लिए है। नीचे दिया गया एनिमेशन दिखाता है कि क्या होता है जब फ्लेक्स - दिशा : कॉलम में जोड़ा जाता है पात्र तत्व। आप भी कर सकते हैं फ्लेक्स सेट करें - दिशा पंक्ति-रिवर्स और कॉलम-रिवर्स के लिए।