CSS旋轉功能可以讓我們非常輕易地制作出一些很華麗的效果，而其中最關鍵的便是如何定義旋轉軸。

在CSS中，我們可以利用“transform-origin”屬性來定義旋轉軸。該屬性接受一對長度值，用于定位旋轉軸相對于元素本身的位置。這一對長度值是一個十分靈活的概念，它可以接受兩個百分比值，也可以接受兩個像素數值，或者是一百分比一像素的組合。

舉個例子，如果我們要讓一個圓形在其頂部旋轉，那么我們可以將“transform-origin”屬性設置為“50% 0%”或者“center top”。這兩種寫法的效果是等價的。在這個例子中，我們選擇的旋轉軸就是圓形的頂部，也就是它的中心點。

除此之外，我們還可以選擇讓一個元素繞著水平軸或者豎直軸旋轉。對于水平軸旋轉，我們可以將“transform-origin”屬性設置為“50% 50%”或者“center center”，對于豎直軸旋轉，則是設置為“0% 50%”或者“left center”。

/* 水平軸旋轉 */
.rotate-horizontally {
transform: rotateX(90deg);
transform-origin: center center;
}
/* 豎直軸旋轉 */
.rotate-vertically {
transform: rotateY(90deg);
transform-origin: left center;
}

需要注意的是，元素的旋轉軸位置是會影響其旋轉效果的。比方說，如果我們將旋轉軸設置在元素的左側，則在執行旋轉時，元素會繞左側的軸進行旋轉。因此，我們需要在設置旋轉軸時，根據元素的具體位置和想要達到的效果進行靈活選擇。