animation 屬性是一個簡寫屬性，用於設定六個動畫屬性：
animation-name animation-duration animation-timing-function animation-delay animation-iteration-count animation-direction
預設值： none 0 ease 0 1 normal
注釋：請始終規定 animation-duration 屬性，否則時間長度為 0，就不會播放動畫了。
文法
animation: name duration timing-function delay iteration-count direction;
animation-name 規定需要綁定到選取器的 keyframe 名稱。。
animation-duration 規定完成動畫所花費的時間，以秒或毫秒計。
animation-timing-function 規定動畫的速度曲線。
animation-delay 規定在動畫開始之前的延遲。
animation-iteration-count 規定動畫應該播放的次數。（值：n次，infinite無限迴圈）
animation-direction 規定是否應該輪流反向播放動畫。
總結：
根據上述屬性，只需要根據具體情況設定animation-delay和animation-iteration-count即可。
例如：
p{animation:mymove 5s 5s infinite;-webkit-animation:mymove 5s 5s infinite; /* Safari 和 Chrome */}
方案例子：
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> .item1{ list-style: none; -webkit-animation: revolving 4s 0s infinite; animation: revolving 4s 0s infinite; } @-webkit-keyframes revolving{ 0,75%{ -webkit-transform: perspective(700px) rotateX(90deg); } 87.5%{ -webkit-transform: perspective(700px) rotateX(0deg); } 100%{ -webkit-transform: perspective(700px) rotateX(-90deg); } } </style></head> <body> <ul> <li class="item1">梅西與美洲杯失之交臂</li> </ul> </body></html>
把總動畫設為4秒，然後前75%也就是3秒都沒變化（0-75%），之後的25%也就是1秒做動畫就可以了。
【相關推薦】
1. 詳細介紹CSS3中animation-direction屬性
2. 必須掌握的CSS3動畫（Animation）的8大屬性
3. 分享一個監聽css3動畫（animation）結束事件執行個體
4. 詳解css3中兩種暫停方式（transition、animation）
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
