Sử dụng chế độ hoạt ảnh lấp đầy thuộc tính để đặt kiểu cho phần tử khi hoạt ảnh không phát.
Bạn có thể thử chạy mã sau để triển khai thuộc tính animation-fill-mode
Ví dụ
<!DOCTYPE html>
<html>
<head>
<style>
div {
width: 150px;
height: 200px;
position: relative;
background: red;
animation-name: myanim;
animation-duration: 2s;
animation-fill-mode: backwards;
}
@keyframes myanim {
from {left: 0px; background-color: green;}
to {left: 200px; background-color: blue;}
}
</style>
</head>
<body>
<div></div>
</body>
</html>