ट्रान्सफॉर्म CSS3 जनरेटर: स्केल, रोटेट, ट्रान्सलेट आणि स्क्यू

CSS3.0 Transform

आळशी लोकांसाठी CSS ट्रान्सफॉर्म जनरेटर.

इच्छित दृश्य मिळविण्यासाठी स्केल सेट करा, फिरवा, भाषांतर करा आणि स्क्यू करा आणि थेट पूर्वावलोकन पहा.

स्क्यू मालमत्तेसाठी अत्यंत मूल्ये सेट करणे टाळा कारण पूर्वावलोकन सेटिंग्ज पॅनेलला कव्हर करू शकते. या स्थितीत तुम्हाला पेज रिफ्रेश करावे लागेल.

 

स्केल, फिरवा, भाषांतर आणि तिरकस करा

स्केल कार्य करते जसे की आपण लक्ष्यित घटक झूम इन आणि आउट कराल. डीफॉल्ट स्केल मूल्य 1 आहे, जे मूळ आकाराचे गुणक म्हणून कार्य करते. याचा अर्थ असा की 0.5 अर्धे तर 2 विभाग दुप्पट करतात.

 

अंशांमध्ये सेट केलेल्या दुसऱ्या गुणधर्मासह घटक घड्याळाच्या दिशेने फिरवा. 180° ने वळणे ऑब्जेक्ट उलटे ठेवते तर 360° ने त्याच्या मूळ सरळ स्थितीत परत येते. कोणतेही सकारात्मक किंवा ऋण मूल्य किंवा अगदी दशांश देखील सेट करा.

 

भाषांतर घटक त्याच्या मूळ स्थितीशी संबंधित पिक्सेलसह हलवते. X मूल्य क्षैतिजरित्या तर Y अनुलंब रोटेट विशेषता शून्य असते तेव्हा.

 

वस्तूंना त्यांच्या क्षैतिज (X) किंवा अनुलंब (Y) एक्सलवर तिरपा करा.

 

CSS रूपांतर स्पष्ट केले 

ट्रान्सफॉर्म सीएसएस गुणधर्म तुम्हाला घटक फिरवू, स्केल करू, स्क्यू करू आणि अनुवाद करू देतो. हे CSS व्हिज्युअल फॉरमॅटिंग मॉडेलचे समन्वय स्थान सुधारित करते.

व्याख्या आणि वापर

ट्रान्सफॉर्म गुणधर्म घटकावर 2D किंवा 3D परिवर्तन लागू करते. हे गुणधर्म तुम्हाला फिरवण्यास, स्केल करण्यास, हलविण्यास, स्क्यू इ., घटकांना अनुमती देते.

ब्राउझर समर्थन

सारणीतील संख्या प्रथम ब्राउझर आवृत्ती निर्दिष्ट करतात जी मालमत्तेला पूर्णपणे समर्थन देते.

-webkit-, -moz-, किंवा -o- नंतरचे क्रमांक उपसर्गासह कार्य करणारी पहिली आवृत्ती निर्दिष्ट करतात.

मांडणी
transform: none|transform-functions|initial|inherit;