alternate 動畫會在廳數(shù)次數(shù)(1,3,5等等)正常播放，面在偶數(shù)次數(shù)(2，4，4)向后播放html>

Document

*{

padding:?0;

margin:?0;

}

#herhr{

display:?block;

margin:?10px?auto;

border:?1px?solid?blue;

/*transform:?rotate(60deg);???infinite讓它一直轉(zhuǎn)*/

/*animation:?hger??10s?linear?infinite;*/

/*alternate?動畫會在廳數(shù)次數(shù)(1,3,5等等)正常播放，面在偶數(shù)次數(shù)(2，4，4)向后播放。*/

/*animation:?hger??5s?linear?infinite?alternate;*/

animation:?hger??10s?linear?infinite;

/*給圖片加個(gè)圓角*/

border-radius:?60%;

}

#herhr:hover{

/*play?游戲????state??規(guī)定???paused??暫停??當(dāng)鼠標(biāo)放在轉(zhuǎn)盤的時(shí)候暫停的意思*/

animation-play-state:?paused;

}

@keyframes?hger{

from{

transform:?rotate(0deg);

}

to{

transform:?rotate(360deg);

}

}

????

總結(jié)

以上是生活随笔為你收集整理的css3动大转盘,css3的animation大转盘写法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。