CSS animation-fill-mode प्रॉपर्टी निर्दिष्ट करती है कि एनिमेशन शुरू होने से पहले और समाप्त होने के बाद तत्व पर कौन सी स्टाइल लागू होनी चाहिए।
उदाहरण
नीचे दिए गए उदाहरण में, animation-fill-mode: backwards का उपयोग करके एनिमेशन शुरू होने से पहले (देरी के दौरान) from कीफ्रेम की स्टाइल लागू की जाती है।
<!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>
animation-fill-mode के मान:
none(डिफ़ॉल्ट): एनिमेशन से पहले/बाद में कोई स्टाइल नहींforwards: अंतिम कीफ्रेम की स्टाइल बनाए रखता हैbackwards: पहला कीफ्रेम की स्टाइल एनिमेशन शुरू होने से पहले लागू करता हैboth: forwards और backwards दोनों लागू करता है
