css动画-滚动通知

使用动画

<div class="horNotice">
  <div class="horMove">
    <span>累计87例死亡 重症八仙有3位赴上海</span>
    <span>北京新增21例感染者 含多名在校生</span>
  </div>
</div>

     .horNotice {
        position: relative;
        width: 100%;
        margin: 0 auto;
        overflow: hidden;
        white-space: nowrap;
        height: 26px;
        .horMove {
          position: absolute;
          top: 0;
          left: 100%;
          white-space: nowrap;
          animation: moveAniHor 30s linear infinite normal;
        }
      }
      @keyframes moveAniHor {
        0% {left: 100%;}
        50% {left: 0;}
        100% {left: -100%;}
      }