অ্যানিমেশন হল মোশন এফেক্ট তৈরি করার প্রক্রিয়া এবং চেহারা পরিবর্তন করে। ইভেন্ট মোশন পরিবর্তন করতে CSS বিভিন্ন অ্যানিমেশন ইফেক্টকে সমর্থন করে।
অ্যানিমেশনের অধীনে, একটি ধারণা কীফ্রেম ব্যবহার করা হয়। কীফ্রেমগুলি CSS3-এ মধ্যবর্তী অ্যানিমেশন পদক্ষেপগুলি নিয়ন্ত্রণ করবে।
নীচের উদাহরণটি কীফ্রেম সিনট্যাক্স সহ উচ্চতা, প্রস্থ, রঙ, নাম এবং অ্যানিমেশনের সময়কাল দেখায় -
সিনট্যাক্স
@keyframes animation {
from {background-color: pink;}
to {background-color: green;}
}
div {
width: 100px;
height: 100px;
background-color: red;
animation-name: animation;
animation-duration: 5s;
} 