CSS ट्रांसफॉर्म जेनरेटर

सीएसएस ट्रांसफॉर्म गाइड

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

वास्तविक समय में लागू प्रत्येक परिवर्तन को देखने के लिए स्लाइडर्स को खींचें। धराशायी आयत मूल स्थिति दिखाता है जबकि ठोस कार्ड परिवर्तित परिणाम दिखाता है। जब आप संतुष्ट हों तो पूर्ण परिवर्तन मान की प्रतिलिपि बनाएँ।

Pro Tips

• परिवर्तन में व्यवस्था मायने रखती है। रूपांतर: अनुवाद(...) घुमाएँ(...) चलता है फिर घूमता है; रोटेट(...) ट्रांसलेट(...) पहले समन्वय प्रणाली को घुमाता है, जिससे अलग-अलग परिणाम मिलते हैं।
• सुचारू होवर प्रभावों के लिए परिवर्तनों को ट्रांज़िशन के साथ संयोजित करें: .कार्ड: होवर { ट्रांसफ़ॉर्म: स्केल(1.05); } संक्रमण के साथ: परिवर्तन .2s; बेस क्लास पर.