可视化雪碧图常见前端css样式

设计，写前端css样式参考实在是有点不合适，但是，部分极个别前端开发真的.....一言难尽。

CSS序列帧（雪碧图）动画样式一：

.RichPoi{
    width: 5rem; /*动画宽高*/
    height:5rem;
    transform: translate(-50%, -50%) scale(1); /*缩放*/
    background-image: url(../content/images/93-yalihuan-100x100-25.png);
    background-size: 125rem 5rem;/*序列帧长图大小*/
    transform-origin: center;
    animation: a_name 1s steps(25) infinite;/*名称、时间、步幅，次数；*/
    /*想要停止最后一帧：animation-fill-mode: forwards;出现空帧记得把position结束位置往前挪一个帧位*/
}
@keyframes a_name {
    100% { background-position: -125rem 0 ;}
}

欢迎，前端大佬，提供更好更多的写法样式！
当前如果前端不愿意写，Apng是最简单的，svga是现在比较更流行的。