在網頁制作中，我們經常需要使用動態圖像來制作出更加生動、美觀的頁面效果。而CSS是一種可以實現動態效果展示的神奇技術，下面介紹如何用CSS制作基本動態圖。

html {
background-color: #f2f2f2;
}
.box {
width: 50px;
height: 50px;
background-color: #f33;
position: relative;
animation: boxMove 3s linear infinite;
}
@keyframes boxMove {
0% {
left: 0;
top: 0;
}
50% {
left: 100px;
top: 100px;
background-color: #333;
}
100% {
left: 0;
top: 0;
background-color: #f33;
}
}

以上代碼中，我們首先設置了網頁的背景顏色，并創建了一個寬高為50px的方形元素，利用position屬性的值設為relative來實現相對定位，并設置了動畫效果的時間、速率、重復次數。

在CSS中，@keyframes是一個定義動畫的關鍵字，我們定義了一個名叫boxMove的動畫幀，通過將left、top坐標屬性從0%到100%進行變化，從而實現方形元素的移動效果；

同時，在boxMove中設置了元素的背景顏色變化效果，使它在移動過程中顏色也隨之變化。

在頁面中引用以上代碼，就能輕松實現一個循環滾動的動態圖。綜上所述，CSS可謂是在網頁制作中一個非常重要的技術，學習CSS動態圖的效果，能夠為我們的網頁制作帶來新的突破和發現。