CSS3動畫是網(wǎng)頁設(shè)計中的重要一環(huán)，讓網(wǎng)頁不再是靜態(tài)的，而變得更加生動活潑。而一個好的CSS3動畫需要優(yōu)秀的素材作為基礎(chǔ)，下面就為大家介紹一些CSS3動畫制作素材。

.box{
width: 200px;
height: 200px;
animation: move 2s infinite alternate;
}
@keyframes move{
from{ transform: translateX(0)}
to{ transform: translateX(300px)}
}

1. CSS3動畫庫

CSS3動畫庫是專門為CSS3動畫設(shè)計所創(chuàng)建的素材網(wǎng)站，提供了眾多優(yōu)秀的CSS3動畫效果。如果需要查找一個特定的效果，這個網(wǎng)站可以非常方便的幫你解決。

2. Iconfont圖標庫

Iconfont圖標庫是一個非常流行的矢量圖標庫，具有很好的兼容性和擴展性，可以通過CSS3編輯器直接調(diào)整圖標的大小、顏色、陰影等效果實現(xiàn)動畫效果。

.box{
width: 100px;
height: 100px;
background: url('iconfont.svg') no-repeat;
animation: rotate 2s infinite linear;
}
@keyframes rotate{
from{ transform: rotate(0)}
to{ transform: rotate(360deg)}
}

3. SVG動畫庫

SVG動畫可以被應(yīng)用在線條、形狀和圖標上，具有很好的分辨率、可伸縮性和互動性。其中，Animation庫提供了很多簡單實用的SVG動畫效果。

4. 音頻/視頻素材庫

音頻、視頻素材配合CSS3動畫，能夠產(chǎn)生更具娛樂性的效果。通過網(wǎng)絡(luò)搜索或者購買的方式，我們可以找到大量的音頻和視頻素材，用于我們的CSS3動畫設(shè)計。

總之，好的CSS3動畫離不開優(yōu)秀的素材作為基礎(chǔ)。借助上述的素材，我們可以打造出更加多樣化的動畫效果。