在網頁設計中，圖片往往是不可或缺的元素之一，而通過CSS可以實現對圖片樣式的控制，其中之一就是控制圖片的跳動。下面我們詳細介紹如何使用CSS控制圖片跳動。

img {
animation: jump 1s infinite alternate;
}
@keyframes jump {
0% {
transform: translateY(0);
}
100% {
transform: translateY(-20px);
}
}

上述代碼中，我們使用了CSS動畫屬性animation以及關鍵幀keyframes，通過這兩個屬性實現圖片跳動的效果。

首先設置img標簽的CSS屬性animation，這里我們將其設置為jump 1s infinite alternate。其中jump是我們定義的關鍵幀名稱，1s表示動畫播放時間，infinite表示動畫持續時間為無限次，alternate表示動畫往返播放。

接下來我們定義關鍵幀jump，從0%到100%設置了兩個狀態，分別是初始狀態和目標狀態。這里我們使用transform屬性，將圖片在Y軸上移動20像素，使其看起來像是在跳躍。最后別忘了加上動畫屬性的前綴。

通過以上CSS代碼的設置，即可實現圖片跳動的效果。我們可以根據實際需求調整跳動距離、時間等屬性，讓圖片呈現更加生動的效果。