早上好，這里是文匯信息服務(wù)官網(wǎng)。
CSS和CSS3都是樣式，CSS3是在CSS上新增了樣式屬性。
比如說animation，transition，transform，border-radius......
animation和transition是我們經(jīng)常用到的屬性。這兩個屬性的區(qū)別就是，一個需要手動觸發(fā)，一個不需要手動觸發(fā)。
它們的 觸發(fā)條件不同。transition通常和hover等事件配合使用，由事件觸發(fā)。animation則立即播放。 循環(huán)。 animation可以設(shè)定循環(huán)次數(shù)。animation可以設(shè)定每一幀的樣式和時間。tranistion 只能設(shè)定頭尾。 animation中可以設(shè)置每一幀需要單獨(dú)變化的樣式屬性， transition中所有樣式屬性都要一起變化。
在我們之前做的網(wǎng)站中，嬰貝兒就添加了一個動畫。頁面右側(cè)的園一直循環(huán)。用的就是animate。
添加一個標(biāo)簽，畫一個鏤空的小圓，然后用animation設(shè)置自己想要的效果。需要學(xué)習(xí)一下 @keyframes 規(guī)則。@keyframes 規(guī)則用于創(chuàng)建動畫。在 @keyframes 中規(guī)定某項 CSS 樣式，就能創(chuàng)建由當(dāng)前樣式逐漸改為新樣式的動畫效果。
兩個搭配使用，就可以寫出想要的效果了。
分享的完畢，如果想看到更多的文章，請關(guān)注山東文匯信息服務(wù)有限公司，再見~
