CSS3新增动画属性“@-webkit-keyframes”，从字面就可以看出其含义——关键帧，这与Flash中的含义一致。利用CSS3制作动画效果其原理与Flash一样，我们需要定义关键帧处的状态效果，由CSS3来驱动产生动画效果。
/*淡出*/
@keyframes fadein{
0%{opacity: 0;}
100%{opacity: 1;}
}
@-webkit-keyframes fadein{
0%{opacity: 0;}
100%{opacity: 1;}
}
@-moz-keyframes fadein{
0%{opacity: 0;}
100%{opacity: 1;}
}
@-o-keyframes fadein{
0%{opacity: 0;}
100%{opacity: 1;}
}
body{
animation:fadein .2s linear 1;
-webkit-animation:fadein .2s linear 1;
-moz-animation:fadein .2s linear 1;
-o-animation:fadein .2s linear 1;
}
