CSS旋轉是讓元素旋轉一定角度的效果，讓頁面更加美觀生動。但是，我們發現旋轉后的元素往往不會以中心點為旋轉點，這樣在設計時就需要考慮如何設置旋轉中心。

transform-origin: x-axis y-axis;

transform-origin屬性就是用來設置旋轉中心的。其中，x-axis設置元素左右中心點的位置，可以使用百分比、像素或關鍵字，其中取值如下：

left、　center、　right

同樣，y-axis設置元素上下中心點的位置，取值同上。如果只設置一個值，則另一個值默認為center。

例如，想將一個方塊以中心點旋轉90度，可以這樣寫：

div{
transform: rotate(90deg);
transform-origin: center;
}

如果希望在左上角旋轉，可以這樣寫：

div{
transform: rotate(90deg);
transform-origin: left top;
}

需要注意的是，旋轉中心點的位置也會受到頁面布局及父元素的影響。如果旋轉的元素有父元素或祖先元素，則旋轉中心點會相對于父元素進行定位。

因此，在進行CSS旋轉時一定要留意旋轉中心點，合理設置可以讓頁面更加美觀。