Css3实现动态轮播效果

 定义动态效果
@keyframes move {
0%{transform: translateX(0%);}
25%{transform: translateX(0%);}
// 25%{transform: translateX(-5.5rem);}
// 45%{transform: translateX(-5.5rem);}
50%{transform: translateX(-5.5rem);}
// 70%{transform: translateX(-11rem);}
75%{transform: translateX(-5.5rem);}
// 95%{transform: translateX(-5.5rem);}
100%{transform: translateX(0%);}
}
.box{
  width: 11rem;
  display:flex;
  animation:move 10s linear infinite;
}