CSS3 மாற்றம் ஜெனரேட்டர்
மென்மையான ஒளிபுகாநிலை மாற்றம்
பிரபலமான முன்னமைவுகள்
மங்கலான விளைவு
மென்மையான ஒளிபுகாநிலை மாற்றம்
அளவுகோல் விளைவு
மிதவை மீது உறுப்பு அளவை மாற்றவும்
விளைவை சுழற்று
மிதவை மீது உறுப்பு சுழற்று
ஸ்லைடு விளைவு
உறுப்பு நிலையை நகர்த்தவும்
நிற மாற்றம்
பின்னணி வண்ண மாற்றம்
மாற்றங்கள் பற்றி
CSS மாற்றங்கள் ஒரு குறிப்பிட்ட காலப்பகுதியில் சொத்து மதிப்புகளை சீராக மாற்ற உங்களை அனுமதிக்கின்றன.
பொதுவாக அனிமேஷன் பண்புகள் பின்வருமாறு:
- அகலம், உயரம்
- விளிம்பு, திணிப்பு
- ஒளிபுகாநிலை, நிறம்
- transform (scale, rotate, translate)
- background-color
சார்பு உதவிக்குறிப்பு: அனைத்து மாற்றங்களையும் உயிரூட்ட 'அனைத்து பண்புகளும்' விருப்பத்தைப் பயன்படுத்தவும்.
Preview
உருவாக்கப்பட்ட குறியீடு
.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; } .element:hover { /* Hover styles will be generated here */ }
மாற்றம் கட்டுப்பாடுகள்
மிதவை விளைவுகள்
Related Tools
CSS மாற்றிக்கு Sass
உங்கள் Sass குறியீட்டை CSS ஆக மாற்றவும். வேகமானது, எளிதானது மற்றும் பாதுகாப்பானது.
CSS மாற்றிக்கு குறைவு
உங்கள் குறைவான குறியீட்டை CSS ஆக மாற்றவும். வேகமானது, எளிதானது மற்றும் பாதுகாப்பானது.
CSS Minifier
தொழில்முறை துல்லியத்துடன் உங்கள் CSS குறியீட்டை சுருக்கி மேம்படுத்தவும்
உரையை எஸ்சிஓ-நட்பு நத்தைகளாக மாற்றவும்
எந்த உரையையும் URLகள், கோப்பு பெயர்கள் மற்றும் பலவற்றிற்கு ஏற்ற URL நட்பு ஸ்லக்காக மாற்றவும்.
JavaScript Minifier
தொழில்முறை-தர minification மூலம் உங்கள் JavaScript குறியீட்டை சுருக்கி மேம்படுத்தவும். கோப்பு அளவைக் குறைக்கவும், சுமை நேரங்களை மேம்படுத்தவும் மற்றும் உங்கள் வலை பயன்பாடுகளுக்கான செயல்திறனை மேம்படுத்தவும்.
SASS மாற்றிக்கு CSS
உங்கள் CSS குறியீட்டை உள்தள்ளப்பட்ட SASS தொடரியல் ஆக மாற்றவும். வேகமானது, எளிதானது மற்றும் பாதுகாப்பானது.