CSS滚动停止和重复问题

我无法使文本对齐或正确滚动，因为某些原因，它想在滚动中间停止，并跳到最后一个

欢迎光临
家
家族
朋友
欢迎光临

由于您的

线高度是50px，因此关键帧动画应该基于50px的倍数，而不是40px

@keyframes change {
  0% {
    margin-top: 0;
  }
  23% {
    margin-top: 0;
  }
  33% {
    margin-top: -50px;
  }
    46% {
    margin-top: -50px;
  }

  56% {
    margin-top: -50px;
  }
  66% {
    margin-top: -100px;
  }
  90% {
    margin-top: -100px;
  }
  100% {
    margin-top: -150px;
  } 
}

它仍然在最后一行跳转，字体在括号中向下推
@keyframes change {
  0% {
    margin-top: 0;
  }
  23% {
    margin-top: 0;
  }
  33% {
    margin-top: -50px;
  }
    46% {
    margin-top: -50px;
  }

  56% {
    margin-top: -50px;
  }
  66% {
    margin-top: -100px;
  }
  90% {
    margin-top: -100px;
  }
  100% {
    margin-top: -150px;
  } 
}