CSS旋轉(zhuǎn)是網(wǎng)頁(yè)設(shè)計(jì)中常用的技巧之一，它能夠讓頁(yè)面元素呈現(xiàn)出更為生動(dòng)的效果。但是，要想讓旋轉(zhuǎn)的元素圍繞某個(gè)中心點(diǎn)進(jìn)行旋轉(zhuǎn)，就需要設(shè)置旋轉(zhuǎn)中心。

transform-origin: x y;

如上圖所示，通過(guò)設(shè)置元素的transform-origin屬性，就可以指定元素旋轉(zhuǎn)時(shí)的中心點(diǎn)。x和y分別代表元素旋轉(zhuǎn)的水平和垂直方向上的位置，取值范圍是0~100%。

如果只設(shè)置一個(gè)值，則旋轉(zhuǎn)中心默認(rèn)為x或y對(duì)應(yīng)的位置，如下圖所示：

transform-origin: center;

如上圖所示，設(shè)置元素的transform-origin屬性為center可以讓元素圍繞中心點(diǎn)進(jìn)行旋轉(zhuǎn)。

在進(jìn)行元素旋轉(zhuǎn)時(shí)，旋轉(zhuǎn)中心的設(shè)置非常重要。合理設(shè)置旋轉(zhuǎn)中心能夠使網(wǎng)頁(yè)設(shè)計(jì)更為精美，為用戶帶來(lái)良好的視覺(jué)體驗(yàn)。