开发工具与关键技术:前端
作者:黄志鹏
撰写时间:2019/1/25
在前端css3中提供了很强大的animation动画,它可以指定多个关键帧,从而允许定义更加丰富的自定义动画
下面我们来用纯css做一个模仿抽奖的动画,首先我们先布局,一个div里放9个span标签,整体布局就是这样了。
代码如下
在设置9个span标签相同的宽高后,再用弹性布局成九宫格型。
代码如下
浏览器输出为
另外我们调用关键帧加一个在不断转动的小子针,和一个随子针一起转动的闪光灯。
代码如下
浏览器输出为
好了我们的模仿抽奖动画就完成了