CSS可以實現許多有趣的特效，其中之一就是圖片抖動效果。下面我們就來看一下如何使用CSS實現圖片抖動。

.image {
position: relative;
animation: shake 0.5s ease-in-out infinite;
}
@keyframes shake {
0% { transform: rotate(0deg); }
25% { transform: rotate(4deg); }
50% { transform: rotate(0deg); }
75% { transform: rotate(-4deg); }
100% { transform: rotate(0deg); }
}

要實現圖片抖動，我們需要使用CSS中的animation動畫屬性和@keyframes關鍵幀。在樣式中定義一個.image類，設置其position屬性為relative，animation屬性為shake 0.5s ease-in-out infinite。其中，shake為關鍵幀的名稱，0.5s為動畫時間，ease-in-out為動畫的速度曲線，infinite為動畫循環次數（無限次循環）。

接下來，我們在@keyframes關鍵幀中定義圖像的抖動效果。我們將圖像沿著X軸進行旋轉，讓它在不同時間點呈現不同的旋轉角度。具體實現方式是，定義一個從0%到100%的動畫過程，其中0%時，圖像的旋轉角度為0度；25%時，圖像的旋轉角度為4度；50%時，圖像的旋轉角度又變回0度；75%時，圖像的旋轉角度變為-4度；最后100%時，圖像的旋轉角度再次變回0度。這樣就實現了圖像的抖動效果。

這就是使用CSS實現圖片抖動的方法，如果你想讓圖片變得更具有動感和趣味性，可以嘗試使用它來設計你的網站或者應用程序的動態效果。