有时候需要在大屏上实现文字滚动展示的效果，今天做了个尝试，记录一下

  <div class="scrolling-text">
     <p>奋斗者奥利给，嘎嘎一嘎斯</p>
  </div>

css如下

            .scrolling-text p {
                display: inline-block;
                font-size: 24px;
                color: red;
                animation: scrollText 10s linear infinite;
            }

            @keyframes scrollText {
                0% {
                    transform: translateY(100%);
                }

                100% {
                    transform: translateY(-100%);
                }
            }

效果如图 08061.gif