度

rotate(90deg) ：順時針旋轉(zhuǎn) 90 度

rotate(105deg) ：順時針旋轉(zhuǎn) 105 度

rotate(120deg) ：順時針旋轉(zhuǎn) 120 度

rotate(135deg) ：順時針旋轉(zhuǎn) 135 度

rotate(150deg) ：順時針旋轉(zhuǎn) 150 度

rotate(165deg) ：順時針旋轉(zhuǎn) 165 度

rotate(180deg) ：逆時針旋轉(zhuǎn) 180 度

旋轉(zhuǎn)木馬效果

CSS3 旋轉(zhuǎn)可用于創(chuàng)建引人入勝的旋轉(zhuǎn)木馬效果。旋轉(zhuǎn)木馬效果是一種常見的 UI 模式，它涉及圍繞其中心連續(xù)旋轉(zhuǎn)一組元素。要創(chuàng)建旋轉(zhuǎn)木馬效果，請使用 @keyframes 規(guī)則指定旋轉(zhuǎn)動畫，然后將該動畫應用于元素。

示例： 以下代碼創(chuàng)建了一個簡單的旋轉(zhuǎn)木馬效果，其中元素以 15 度角順時針旋轉(zhuǎn)：

    @keyframes rotate {0% {transform: rotate(0deg);}100% {transform: rotate(360deg);}}.carousel {animation: rotate 5s infinite linear;}

結(jié)論

CSS3 旋轉(zhuǎn)屬性是網(wǎng)頁設計中一個強大的工具。通過了解 transform 屬性并使用不同的旋轉(zhuǎn)值，您可以創(chuàng)建引人入勝的動畫、旋轉(zhuǎn)木馬效果和其他視覺效果。使用 CSS3 旋轉(zhuǎn)，您可以最大限度地發(fā)揮您的創(chuàng)造力，并為您的用戶打造更加直觀和吸引人的體驗。

---

---

相關(guān)標簽： 提升您的網(wǎng)頁設計、 CSS3、 css3旋轉(zhuǎn)木馬效果、 旋轉(zhuǎn)指南、

上一篇：CSS手冊從初學者到專css手冊中文版

下一篇：CSS3旋轉(zhuǎn)教程從基礎到高級技巧css3旋轉(zhuǎn)屬性