css3 精灵图制作动画

示例：

background-size: 1600% 100%;
-webkit-animation: FireAnimation 3s steps(16) infinite;
-o-animation: FireAnimation 3s steps(16) infinite;
animation: FireAnimation 3s steps(16) infinite;

@-webkit-keyframes FireAnimation {
  100% {
    background-position: -1600% 0%;
  }
}

 

 

注意：精灵图的  background-size 和 background-position的单位需要一致，不然ios 和android上显示会有很多花里胡哨的bug