在網頁設計中，我們經常要使用圖片來豐富頁面的內容，但是有時候我們需要對圖片進行調整，例如旋轉，這時候如何讓圖片自動進行css旋轉呢？下面我們來介紹一下。

img{
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
transition-duration: 0.8s;
}
img:hover{
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}

在上述代碼中，我們通過設置transition-duration屬性，定義了圖片旋轉需要的時間，這里我們設置了0.8秒。而在hover偽類中，我們則使用transform屬性對圖片進行旋轉，通過設置旋轉角度，這里我們設置為360度，讓圖片進行完整的一次旋轉。

這個方法的好處在于，在鼠標懸停在圖片上時，圖片能夠自動進行旋轉，且旋轉動畫較為平滑，增加了視覺效果，讓網頁更加生動有趣。

當然，這個方法只適用于鼠標懸停在圖片上時進行自動旋轉，如果需要實現其他形式的自動旋轉，還需要采用其他相關技術。