摩天轮小动画

在前端网上看到别人写了这么一个小动画,就拿来模仿练习下。

学到的知识点:
1、 @keyframes
2、animation属性

一:首先,@keyframes属性,指定动画名称和动画效果。
用法:@keyframes animation-name { 动画效果 }

摩天轮小动画_第1张图片

或者

摩天轮小动画_第2张图片

具体可以参照:[http://www.w3chtml.com/css3/rules/@keyframes.html]

二、animation属性

具体参照:[http://www.w3chtml.com/css3/properties/animation/animation.html]

这个例子的重点就是这两个属性。下面就是动画的代码:




    
    摩天轮

不积跬步无以至千里

你可能感兴趣的:(摩天轮小动画)