Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> CSS

ตั้งค่าสไตล์ CSS เมื่อแอนิเมชันไม่ได้เล่น

ใช้คุณสมบัติ animation-fill-mode เพื่อตั้งค่าสไตล์ขององค์ประกอบเมื่อแอนิเมชันไม่ได้เล่น

ตัวอย่าง

<!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>