服務熱線 400-660-5555 （轉1）
網站建設
您可以隨意更改任意數量的CSS屬性。
如需使用CSS動畫，您必須首先為動畫指定一些關鍵幀。
關鍵幀包含元素在特定時間所擁有的樣式。
配置動畫創建動畫序列，需要使用animation屬性或其子屬性，該屬性允許配置動畫時間、時長以及其他動畫細節，但該屬性不能配置動畫的實際表現，動畫的實際表現是由@keyframes規則實現，具體情況參見使用keyframes定義動畫序列小節部分。animation的子屬性有：animation-delay...
使用keyframes定義動畫序列一旦完成動畫的時間設置，接下來就需要定義動畫的表現。通過使用@keyframes建立兩個或兩個以上關鍵幀來實現。首先編寫我們想要的動畫
CSS3動畫的代碼相對簡單。CSS缺點：
動畫控制上不夠靈活。
兼容性不佳
部分動畫無法實現（視差效果、滾動動畫）
from{background-color：red;}
to{background-color：yellow;}
}
上下效果同等。
@keyframesdot{
0%{background-color：red;}
100%{background-color：yellow;}
}
接下來編寫完動畫，需要使用該動畫。
animation-name：設置需要綁定到元素的動畫名稱；
animation-duration：設置完成動畫所需要花費的時間，單位為秒或毫秒，默認為0；
animation-timing-function：設置動畫的速度曲線，默認為ease；
animation-fill-mode：設置當動畫不播放時（動畫播放完或延遲播放時）的狀態；
animation-delay：設置動畫開始之前的延遲時間，默認為0；
animation-iteration-count：設置動畫被播放的次數，默認為1；
animation-direction：設置是否在下一周期逆向播放動畫，默認為normal；
animation-play-state：設置動畫是正在運行還是暫停，默認是running；
animation：所有動畫屬性的簡寫屬性。
添加動力小姐姐微信
電話咨詢
400-660-5555 （轉1）
