המאפיין @keyframes הכלל @keyframes מציין את קוד האנימציה.
האנימציה נוצרת על ידי שינוי הדרגתי מסט אחד של סגנונות CSS לאחר.
במהלך האנימציה, אתה יכול לשנות את סט סגנונות ה-CSS פעמים רבות.
ציין מתי שינוי הסגנון יתרחש באחוזים, או עם מילות המפתח "מאת" ו"אל", שזהה ל-0% ו-100%. 0% הוא ההתחלה של האנימציה, 100% הוא כאשר האנימציה הושלמה.
טיפ: לקבלת התמיכה הטובה ביותר בדפדפן, עליך להגדיר תמיד גם את הבוררים של 0% וגם את ה-100%.
הערה: השתמש במאפייני האנימציה כדי לשלוט במראה ההנפשה, וגם כדי לאגד את האנימציה לבוררים.
הערה: הכלל !important מתעלם במסגרת מפתח (ראה דוגמה אחרונה בדף זה).
דוגמא: