利用css3实现兔斯基动画效果

css3实现兔斯基动画效果：

图片是从网上找的，有的地方会有动作残留。

html代码：

<div id="warp"></div>

css样式如下：

#warp{position: absolute;top: 50%;left:50%;transform: translate3d(-50%,-50%,0);background: url(img/tsj.png);background-position: 0 0;width: 165px;height: 200px;animation: move 1s infinite steps(7,end);}@keyframes move {from{background-position: 0 0;}to{background-position: -1152px 0;}}

利用动画效果，挪动位置，创建关键帧，轻轻松松让图片动起来，一起来试试吧。