CSS動態圖片是網頁設計中必不可少的一環，它可以使網頁更加生動、美觀。下面是一些常見的CSS動態圖片。

/* CSS3旋轉動畫 */
.rotate{
animation: rotate 2s linear infinite;
}
@keyframes rotate{
100%{
transform: rotate(360deg);
}
}
/* CSS3縮放動畫 */
.scale{
animation: scale 1s ease-in-out infinite alternate;
}
@keyframes scale{
0%{
transform: scale(1);
}
100%{
transform: scale(1.2);
}
}
/* 水平滾動動畫 */
.scroll{
animation: scroll 5s linear infinite;
}
@keyframes scroll{
0%{
transform: translateX(0);
}
100%{
transform: translateX(-100%);
}
}
/* 垂直下落動畫 */
.fall{
animation: fall 2s ease-in-out infinite;
}
@keyframes fall{
0%{
transform: translateY(-50px);
}
100%{
transform: translateY(50px);
}
}
/* 透明度動畫 */
.fade{
animation: fade 1s ease-in-out infinite alternate;
}
@keyframes fade{
0%{
opacity: 0.2;
}
100%{
opacity: 1;
}
}

以上是一些常見的CSS動態圖片，它們可以通過一些簡單的代碼實現。當然，還有很多其他的動畫效果，需要我們不斷的學習和實踐，才能更好地應用它們。在網頁設計中，CSS動態圖片是一個非常重要的設計元素，它可以提升網站的用戶體驗，使網站更加生動、時尚。