编程学习网 > 编程教程 > CSS3 教程
2015
10-13

CSS3 动画

清华大佬耗费三个月吐血整理的几百G的资源,免费分享!....>>>

CSS3 动画


CSS3 动画

CSS3,我们可以创建动画,它可以取代许多网页动画图像,Flash动画,和JAVAScripts。


CSS3
动画

CSS3 @keyframes 规则

要创建CSS3动画,你将不得不了解@keyframes规则。

@keyframes规则是创建动画。 @keyframes规则内指定一个CSS样式和动画将逐步从目前的样式更改为新的样式。


浏览器支持

属性 浏览器支持
@keyframes
animation

Internet Explorer 10、Firefox 以及 Opera 支持 @keyframes 规则和 animation 属性。

Chrome 和 Safari 需要前缀 -webkit-。

注意:Internet Explorer 9,以及更早的版本,不支持 @keyframe 规则或 animation 属性。


OperaSafariChromeFirefoxInternet Explorer

实例

@keyframes myfirst
{
from {background: red;}
to {background: yellow;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
from {background: red;}
to {background: yellow;}
}

扫码二维码 获取免费视频学习资料

编程学习