CSS3让动画停留在最后一帧

我在画文章首页的那个蝴蝶的时候就想让蝴蝶飞到梅花上,然后就停留在那里。但是我看了看w3cschool,没有让动画停留在最后一帧,怎么办呢?其实可以这样解决。

首先我们让我们需要处理的元素 开始就停留在最后一帧 ,比如我的蝴蝶我一开始就让他在梅花上面了。

然后动画执行到0%的时候,也就是开始的时候我们让动画瞬间移动到我们想要开始的位置,这样结束后动画就可以在最后一帧了。