ਟਰਾਂਸਫਾਰਮ CSS3 ਜਨਰੇਟਰ: ਸਕੇਲ, ਰੋਟੇਟ, ਟ੍ਰਾਂਸਲੇਟ ਅਤੇ ਸਕਿਊ

CSS3.0 Transform

ਆਲਸੀ ਲੋਕਾਂ ਲਈ CSS ਟ੍ਰਾਂਸਫਾਰਮ ਜਨਰੇਟਰ।

ਲੋੜੀਂਦਾ ਦ੍ਰਿਸ਼ ਪ੍ਰਾਪਤ ਕਰਨ ਲਈ ਪੈਮਾਨੇ ਨੂੰ ਸੈੱਟ ਕਰੋ, ਘੁੰਮਾਓ, ਅਨੁਵਾਦ ਕਰੋ ਅਤੇ ਤਿੱਖਾ ਕਰੋ ਅਤੇ ਲਾਈਵ ਪ੍ਰੀਵਿਊ ਦੇਖੋ।

ਸਕਿਊ ਪ੍ਰਾਪਰਟੀ ਲਈ ਬਹੁਤ ਜ਼ਿਆਦਾ ਮੁੱਲ ਸੈੱਟ ਕਰਨ ਤੋਂ ਬਚੋ ਕਿਉਂਕਿ ਪ੍ਰੀਵਿਊ ਸੈਟਿੰਗ ਪੈਨਲ ਨੂੰ ਕਵਰ ਕਰ ਸਕਦਾ ਹੈ। ਇਸ ਸਥਿਤੀ ਵਿੱਚ ਤੁਹਾਨੂੰ ਪੇਜ ਨੂੰ ਰਿਫ੍ਰੈਸ਼ ਕਰਨਾ ਹੋਵੇਗਾ।

 

ਸਕੇਲ, ਰੋਟੇਟ, ਟ੍ਰਾਂਸਲੇਟ ਅਤੇ ਸਕਿਊ

ਸਕੇਲ ਇਸ ਤਰ੍ਹਾਂ ਕੰਮ ਕਰਦਾ ਹੈ ਜਿਵੇਂ ਤੁਸੀਂ ਨਿਸ਼ਾਨੇ ਵਾਲੇ ਤੱਤ ਨੂੰ ਜ਼ੂਮ ਇਨ ਅਤੇ ਆਊਟ ਕਰੋਗੇ। ਪੂਰਵ-ਨਿਰਧਾਰਤ ਸਕੇਲ ਮੁੱਲ 1 ਹੈ, ਜੋ ਅਸਲ ਆਕਾਰ ਦੇ ਗੁਣਕ ਵਜੋਂ ਕੰਮ ਕਰਦਾ ਹੈ। ਇਸਦਾ ਮਤਲਬ ਹੈ ਕਿ 0.5 ਅੱਧੇ ਜਦਕਿ 2 ਭਾਗ ਨੂੰ ਦੁੱਗਣਾ ਕਰਦੇ ਹਨ।

 

ਡਿਗਰੀ ਵਿੱਚ ਸੈੱਟ ਕੀਤੀ ਦੂਜੀ ਵਿਸ਼ੇਸ਼ਤਾ ਨਾਲ ਤੱਤ ਨੂੰ ਘੜੀ ਦੀ ਦਿਸ਼ਾ ਵਿੱਚ ਘੁੰਮਾਓ। 180° ਨਾਲ ਮੋੜਨ ਨਾਲ ਵਸਤੂ ਨੂੰ ਉਲਟਾ ਕਰ ਦਿੱਤਾ ਜਾਂਦਾ ਹੈ ਜਦੋਂ ਕਿ 360° ਲੈਂਦਾ ਹੈ ਆਪਣੀ ਅਸਲ ਸਿੱਧੀ ਸਥਿਤੀ 'ਤੇ ਵਾਪਸ ਆ ਜਾਂਦਾ ਹੈ। ਕੋਈ ਵੀ ਸਕਾਰਾਤਮਕ ਜਾਂ ਨਕਾਰਾਤਮਕ ਮੁੱਲ ਜਾਂ ਦਸ਼ਮਲਵ ਵੀ ਸੈੱਟ ਕਰੋ।

 

ਅਨੁਵਾਦ ਤੱਤ ਨੂੰ ਇਸਦੀ ਅਸਲ ਸਥਿਤੀ ਨਾਲ ਸਬੰਧਤ ਪਿਕਸਲਾਂ ਨਾਲ ਬਦਲਦਾ ਹੈ। X ਦਾ ਮੁੱਲ ਲੇਟਵੇਂ ਤੌਰ 'ਤੇ ਜਦੋਂ ਕਿ Y ਲੰਬਕਾਰੀ ਤੌਰ 'ਤੇ ਜਦੋਂ ਰੋਟੇਟ ਗੁਣ ਜ਼ੀਰੋ ਹੁੰਦਾ ਹੈ।

 

ਵਸਤੂਆਂ ਨੂੰ ਉਹਨਾਂ ਦੇ ਹਰੀਜੱਟਲ (X) ਜਾਂ ਵਰਟੀਕਲ (Y) ਐਕਸਲ 'ਤੇ ਤਿਲਕਾਓ।

 

CSS ਪਰਿਵਰਤਨ ਦੀ ਵਿਆਖਿਆ ਕੀਤੀ ਗਈ 

ਟ੍ਰਾਂਸਫਾਰਮ CSS ਵਿਸ਼ੇਸ਼ਤਾ ਤੁਹਾਨੂੰ ਕਿਸੇ ਤੱਤ ਨੂੰ ਘੁੰਮਾਉਣ, ਸਕੇਲ ਕਰਨ, ਤਿਲਕਣ ਅਤੇ ਅਨੁਵਾਦ ਕਰਨ ਦਿੰਦੀ ਹੈ। ਇਹ CSS ਵਿਜ਼ੂਅਲ ਫਾਰਮੈਟਿੰਗ ਮਾਡਲ ਦੀ ਕੋਆਰਡੀਨੇਟ ਸਪੇਸ ਨੂੰ ਸੰਸ਼ੋਧਿਤ ਕਰਦਾ ਹੈ।

ਪਰਿਭਾਸ਼ਾ ਅਤੇ ਵਰਤੋਂ

ਪਰਿਵਰਤਨ ਵਿਸ਼ੇਸ਼ਤਾ ਇੱਕ ਤੱਤ ਲਈ ਇੱਕ 2D ਜਾਂ 3D ਪਰਿਵਰਤਨ ਲਾਗੂ ਕਰਦੀ ਹੈ। ਇਹ ਵਿਸ਼ੇਸ਼ਤਾ ਤੁਹਾਨੂੰ ਘੁੰਮਾਉਣ, ਸਕੇਲ, ਮੂਵ, ਸਕਿਊ, ਆਦਿ, ਤੱਤਾਂ ਦੀ ਆਗਿਆ ਦਿੰਦੀ ਹੈ।

ਬ੍ਰਾਊਜ਼ਰ ਸਪੋਰਟ

ਸਾਰਣੀ ਵਿੱਚ ਨੰਬਰ ਪਹਿਲੇ ਬ੍ਰਾਊਜ਼ਰ ਸੰਸਕਰਣ ਨੂੰ ਦਰਸਾਉਂਦੇ ਹਨ ਜੋ ਸੰਪੱਤੀ ਦਾ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਕਰਦਾ ਹੈ।

-webkit-, -moz-, ਜਾਂ -o- ਤੋਂ ਬਾਅਦ ਨੰਬਰ ਪਹਿਲੇ ਸੰਸਕਰਣ ਨੂੰ ਨਿਰਧਾਰਤ ਕਰਦੇ ਹਨ ਜੋ ਇੱਕ ਅਗੇਤਰ ਨਾਲ ਕੰਮ ਕਰਦਾ ਹੈ।

ਸੰਟੈਕਸ
transform: none|transform-functions|initial|inherit;