（网络图片、如侵权必删除）
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> *{ padding: 0; margin: 0; } .fire{ width:166.7px; height:296px; background:url(img/img4.jpg) no-repeat; animation: round 1s steps(9) infinite alternate;//非线性时间 step(n) } @keyframes round{ 100%{ background-position-x:-1500px ; } } </style> </head> <body> <div class="fire"></div> </body> </html>
效果图
原文：https://www.cnblogs.com/liangtao999/p/11807041.html