CSS3 移除動畫是通過使用 @keyframes 規則中的關鍵字 none 來實現的。@keyframes 規則用于創建動畫效果,none 關鍵字則用于移除動畫效果。
/* 定義動畫效果 */ @keyframes myAnimation { 0% { opacity: 0; } 100% { opacity: 1; } } /* 應用動畫 */ div { animation: myAnimation 1s ease-in-out forwards; } /* 移除動畫 */ div { animation: none; }
在上面的代碼中,我們首先定義了一個名為 myAnimation 的動畫效果,該動畫效果在 0% 和 100% 之間通過 opacity 屬性實現逐漸顯現的效果。然后我們通過 animation 屬性將該動畫應用于 div 元素,并設置了動畫的持續時間、緩動函數和填充模式。
最后,當我們需要移除動畫效果時,只需要將 animation 屬性設置為 none 即可。
上一篇css3元素重疊