最近2018中文字幕在日韩欧美国产成人片_国产日韩精品一区二区在线_在线观看成年美女黄网色视频_国产精品一区三区五区_国产精彩刺激乱对白_看黄色黄大色黄片免费_人人超碰自拍cao_国产高清av在线_亚洲精品电影av_日韩美女尤物视频网站

這篇文章主要為大家展示了css動(dòng)畫效果之a(chǎn)nimation的常用樣式有哪些，內(nèi)容簡(jiǎn)而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶大家一起來研究并學(xué)習(xí)一下“css動(dòng)畫效果之a(chǎn)nimation的常用樣式有哪些”這篇文章吧。

隆林網(wǎng)站制作公司哪家好，找創(chuàng)新互聯(lián)公司！從網(wǎng)頁(yè)設(shè)計(jì)、網(wǎng)站建設(shè)、微信開發(fā)、APP開發(fā)、響應(yīng)式網(wǎng)站開發(fā)等網(wǎng)站項(xiàng)目制作，到程序開發(fā)，運(yùn)營(yíng)維護(hù)。創(chuàng)新互聯(lián)公司2013年至今到現(xiàn)在10年的時(shí)間，我們擁有了豐富的建站經(jīng)驗(yàn)和運(yùn)維經(jīng)驗(yàn)，來保證我們的工作的順利進(jìn)行。專注于網(wǎng)站建設(shè)就選創(chuàng)新互聯(lián)公司。

animation動(dòng)畫

定義一個(gè)動(dòng)畫：

/*設(shè)置一個(gè)關(guān)鍵幀，定義動(dòng)畫每一步執(zhí)行的動(dòng)作*/
@keyframes mybox{
            0%{transform: translate(0,0);}
            25%{transform: translate(200px,0);}
            50%{transform: translate(200px,200px);}
            75%{transform: translate(0,200px);}
            100%{transform: translate(0,0);}
        }

/*引用關(guān)鍵幀，設(shè)置動(dòng)畫的執(zhí)行樣式*/
animation: mybox 5s 1s infinite;

注：

1、動(dòng)畫結(jié)束后回到初始位置。
2、from->0%    to ->100%

animation-name: 動(dòng)畫的名字，（必須存在）

animation-duration: 動(dòng)畫持續(xù)的時(shí)間

animation-delay:規(guī)定多長(zhǎng)時(shí)間后出現(xiàn)動(dòng)畫效果

animation-iteration-count: 定義動(dòng)畫執(zhí)行的次數(shù)

默認(rèn)值是：1； 無限次數(shù)：infinite

animation-timing-function: 定義動(dòng)畫的效果animation-fill-mode:

none:默認(rèn)值；  樣式在延遲之后生效；
backwards：  樣式在延遲之前生效；
forwards： 在動(dòng)畫結(jié)束之后，停在終點(diǎn)位置；
both:  具備backwards和forwards的特性；

以上就是關(guān)于“css動(dòng)畫效果之a(chǎn)nimation的常用樣式有哪些”的內(nèi)容，如果改文章對(duì)你有所幫助并覺得寫得不錯(cuò)，勞請(qǐng)分享給你的好友一起學(xué)習(xí)新知識(shí)，若想了解更多相關(guān)知識(shí)內(nèi)容，請(qǐng)多多關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

當(dāng)前標(biāo)題：css動(dòng)畫效果之a(chǎn)nimation的常用樣式有哪些
URL網(wǎng)址：http://fisionsoft.com.cn/article/psecgj.html