CSS實現圖像旋轉動態效果

CSS實現圖像旋轉動態效果首先，應向需要設置旋轉的div的css樣式中添加如下代碼：
例如向一個名為img01的類選擇器添加旋轉樣式，在animation屬性內設置，旋轉動畫，rotate為動畫名（自定義的名稱），6s為周期，linear為線性漸變（取消漸變效果），infinite為無限循環，即每輪動畫結束後自動進入下一輪，實現無限旋轉效果。

.img01{
 display: block;
 animation: rotate 6s linear infinite;
} 

在類選擇器重定義好後，則需再向css文件中添加如下樣式代碼：
rotate對應類選擇其中自定義的動畫名稱。transform屬性中設置了從0度旋轉到360（順時針），若要設置逆時針旋轉，可將數值顛倒。

@keyframes rotate{
	0%{
		transform: rotateZ(0deg);/*從0度開始*/
	}




	100%{
		transform: rotateZ(360deg);/*360度結束*/
	}
}

正確添加以上代碼後，就可實現自動無限旋轉效果啦