在網站設計中，經常需要用到圖片旋轉換圖來美化頁面。使用CSS可以輕松實現圖片旋轉效果，下面就讓我們來一步步實現。

.rotate-img {
transform: rotate(45deg);
}

首先，我們創建一個class名為“rotate-img”的css樣式。在此樣式下，我們使用CSS3的transform屬性來達到旋轉效果。其中rotate(deg)函數用于指定旋轉角度，例如“45deg”就是旋轉45度。

接下來，我們在HTML頁面上使用標簽引入圖片，并為該圖片添加之前創建好的“rotate-img”樣式，使圖片得到旋轉效果。

如果我們希望圖片圍繞自身的某一點進行旋轉，而不是默認的中心點，我們可以通過設置transform-origin屬性來實現。

.rotate-img {
transform: rotate(45deg);
transform-origin: top left;
}

在上述代碼中，我們將transform-origin屬性設置為“top left”，表示旋轉圍繞圖片的左上角進行。同樣，我們也可以使用“top right”、“bottom left”、“bottom right”等指定點。

除了旋轉效果外，CSS還可以實現圖片的縮放、平移等效果，可以根據實際需要靈活運用。

最后，提醒大家不要頻繁使用過多CSS動畫，會降低網站性能，影響用戶體驗。