使用CSS3动画属性实现360无限循环旋转

来源：网络整理时间:2015-07-16 关键词:

本篇文章主要介绍了"使用CSS3动画属性实现360无限循环旋转"，主要涉及到方面的内容，对于HTMLjrs看球网直播吧_低调看直播体育app软件下载_低调看体育直播感兴趣的同学可以参考一下：使用CSS3的animation动画属性实现360°无限循环旋转。代码片段：

使用CSS3的animation动画属性实现360°无限循环旋转。

代码片段：

　　 //图片路径自定义

CSS样式书写如下：

#change{ position:absolute; right:200px; -webkit-animation:change 2s linear infinite;}

@-webkit-keyframes change

{

　　0%{-webkit-transform:rotate(0deg);}

　　50%{-webkit-transform:rotate(180deg);}

　　100%{-webkit-transform:rotate(360deg);}

}

搞定！！！当然，这里只写了chrome/Safari浏览器的兼容，其它的可再加上：

@-moz-keyframes change{***} 火狐

@-ms-keyframes change{***} IE

@keyframes change{***} W3C

Opera浏览器不支持animation属性！！！

以上就介绍了使用CSS3动画属性实现360无限循环旋转，包括了方面的内容，希望对HTMLjrs看球网直播吧_低调看直播体育app软件下载_低调看体育直播有兴趣的朋友有所帮助。

本文网址链接：http://www.codes51.com/article/detail_150087.html