有时在展示大型（高精度、长时间）的GIF时，会因为加载时间而得不到预期的效果。
这时，如果用一张jpg的图来展示就是很好的选择，废话不多说，看实例：
<style type="text/css">
<!--
div {
width:400px;
height:180px;
background-image:url(http://blog.hanice.us/wp-content/uploads/2014/06/cs169.jpg);
animation:play 3.5s steps(111) infinite; /**动画名字 持续时间 帧数 循环(infinite为无限，数字为次数)**/
}
@keyframes play {
0% { background-position: 0 0; } /**开始位置(横纵)**/
100% { background-position: 0 -19980px; } /**结束位置(横纵)**/
-->
</style>
<p>JPG(图片1.0M)</p>
<div></div>
<p>GIF(图片3.5M)</p>
<img src="http://blog.hanice.us/wp-content/uploads/2014/06/CS169.gif">