大家好，本篇文章分享小方塊來回旋轉動畫特效，歡迎參考和指正。
效果圖：
小方塊來回旋轉動畫特效
HTML代碼：
CSS代碼：
知識點：
animation：是CSS3的動畫屬性，這裡把animation綁定到tui-demo-2元素上，並指定該動畫需要2.0秒完成，infinite則表示無限次播放該動畫。
@keyframes：該規則表示動畫可以逐步從一個CSS樣式改變為另一個CSS樣式。這裡0％是動畫開頭，100％是動畫結束。
transform：該屬性應用於2D元素或3D元素的轉換，允許元素髮生旋轉，縮放，移動，傾斜等效果。rotate定義2D旋轉，可以配置旋轉角度。
最後注意下瀏覽器兼容問題，-webkit-,-ms-或-moz-，有問題可以留言，大家一起學習HTML+CSS基礎入門開發。
分享到:
