在 CSS 中，我們可以通過使用transform屬性來實現圖標旋轉的效果。具體來說，我們可以通過設置transform: rotate(180deg);對圖標進行 180 度的旋轉。

下面是一個示例代碼，展示如何將一個箭頭圖標旋轉 180 度：

.arrow {
width: 20px;
height: 20px;
transform: rotate(180deg);
}

在上面的代碼中，我們首先定義了一個類名為arrow的樣式。接著，我們通過設置width和height屬性來指定箭頭圖標的大小。最后，我們使用transform: rotate(180deg);來將箭頭圖標旋轉 180 度。

我們還可以通過設置transition屬性來實現平滑的旋轉動畫效果，具體代碼如下：

.arrow {
width: 20px;
height: 20px;
transition: transform 0.5s ease;
}
.arrow:hover {
transform: rotate(180deg);
}

在上面的代碼中，我們通過設置transition: transform 0.5s ease;來指定樣式變化的過渡效果，其中0.5s表示過渡時間為 0.5 秒，ease表示過渡函數為緩動函數。接著，我們通過:hover偽類來表示鼠標懸浮在箭頭圖標上方時的樣式變化，即將箭頭圖標旋轉 180 度。

總的來說，通過使用transform屬性，我們可以輕松實現圖標旋轉的效果，而結合transition屬性，我們還可以實現平滑的過渡動畫效果。