效果图:css 实现一部分场景与动画,剩下得有时间继续完善vue
效果图:css
实现一部分场景与动画,剩下得有时间继续完善vue
主要使用svg画不规则物体,连体山脉与草丛背景都是使用svg一笔画出,路径画法参考SVG矢量绘图 path路径详解(贝塞尔曲线, 曲线, 平滑直线及弧形)css3
剩下大部分都是由div+css制做完成,不规则圆形等使用border-radius,不规则四边形使用transform:skew()属性变换,动画使用@keyframes 定义位置动画git
github:github地址动画展现:小鸡吃米github