@keyframes run{

      0%{

        background-position: 0 0;

      }

      8.333%{

        background-position: -140px 0;

      }

      16.666%{

        background-position: -280px 0 ;

      }

      25.0%{

        background-position: -420px 0 ;

      }

      33.333%{

        background-position: -560px 0 ;

      }

      41.666%{

        background-position: -700px 0 ;

      }

      50.0%{

        background-position: -840px 0 ;

      }

      58.333%{

        background-position: -980px 0 ;

      }

      66.666%{

        background-position: -1120px 0 ;

      }

      75.0%{

        background-position: -1260px 0 ;

      }

      83.333%{

        background-position: -1400px 0 ;

      }

      91.666%{

        background-position: -1540px 0 ;

      }

      100%{

        background-position: 0 0 ;

      }

    }        

.div{

  width:140px;

  height:140px;

  background: url(http://images2015.cnblogs.com/blog/754767/201606/754767-20160601000042992-1734972084.png) ;

  animation:run 1s steps(1, start) infinite;

  -webkit-animation:run 1s steps(1, start) infinite;

}