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;