Animation (còn gọi là hiệu ứng) là tiến trình tạo các thay đổi tới hình dáng và tạo các sự chuyển động của các phần tử.

Qui tắc @keyframes trong CSS

Qui tắc @keyframs sẽ điều khiển các bước hiệu ứng trung gian trong CSS3.

Ví dụ của qui tắc @keyframes với Left Animation

@keyframes animation {
   from {background-color: pink;}
   to {background-color: green;}
}
div {
   width: 100px;
   height: 100px;
   background-color: red;
   animation-name: animation;
   animation-duration: 5s;
}

```Như trong ví dụ trên, chúng ta đã xác định chiều cao, độ rộng, màu, tên và quãng thời gian của hiệu ứng với cú pháp mẫu của qui tắc @keyframes.

Hiệu ứng di chuyển sang trái (Left Animation) trong CSS
-------------------------------------------------------

Hoc CSS co ban tai VietJack

Vi du hieu ung di chuyen tu trai qua phai.

```Kết quả là:−

Hoc CSS co ban tai VietJack

Vi du hieu ung di chuyen tu phai qua trai.