सीएसएस का उपयोग करके मध्य से एक डीआईवी का विस्तार करना

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

विस्तार की कुंजी

रहस्य मार्जिन संपत्ति में हेरफेर करने में निहित है एक सटीक सूत्र के माध्यम से. मार्जिन में परिवर्तन करके, हम DIV के केंद्र के चारों ओर विस्तार की वांछित मात्रा निर्दिष्ट कर सकते हैं।

विस्तार विकल्प

मध्यम विस्तार प्रभाव प्राप्त करने के लिए, हम कई विकल्प प्रस्तुत करते हैं:

विकल्प 1: आरक्षित स्थान के भीतर विस्तार

यह तकनीक इसके आस-पास के तत्वों को बरकरार रखते हुए, इसके चारों ओर एक आरक्षित क्षेत्र के भीतर डीआईवी का विस्तार करती है।

विकल्प 2 : आसपास के तत्वों पर विस्तार

इस विकल्प में, DIV अपने आसपास के तत्वों पर विस्तार करता है, जिससे वे तदनुसार स्थानांतरित हो जाते हैं।

विकल्प 3: विस्तार और तत्व स्थानांतरण

यह विधि विस्तार और तत्व स्थानांतरण को जोड़ती है, जिससे DIV को न केवल तत्वों पर विस्तार करने की अनुमति मिलती है, बल्कि प्रवाह में इसके बाद के तत्वों को भी स्थानांतरित करने की अनुमति मिलती है।

अतिरिक्त परिदृश्य

• गैर-वर्ग विस्तार: तकनीक गैर-वर्ग डीआईवी के लिए भी काम करती है, जो विभिन्न आकृतियों की अनुमति देती है।
• उत्तरदायी विस्तार: द्वारा सूत्र में मामूली संशोधन करके, हम विभिन्न स्क्रीन आकारों को सहजता से समायोजित करते हुए प्रतिक्रियाशील विस्तार भी प्राप्त कर सकते हैं।