css实现⽂字左右滚动效果
<div className={aryContainer}>
<div className={aryBlockFirst}>
注释：⾃2019年7⽉起，这是⼀段很长的⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本,                    本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本。
</div>
<div className={aryBlockSecond}>
注释：⾃2019年7⽉起，这是⼀段很长的⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本,                    本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本⽂本。
</div
</div>
.rotaryContainer{
background-color: yellow;
color: red;
height: 30px;
margin-top: 10px;
line-height: 30px;
overflow: hidden;
position: relative;
}
.rotaryBlockFirst {
animation: rotaryBlockFirst 20s linear infinite;
white-space: nowrap;
position: absolute;
width: 100%;
}
.rotaryBlockSecond {
animation: rotaryBlockSecond 20s linear infinite;
position: absolute;
white-space: nowrap;
width: 100%;
}
@keyframes rotaryBlockFirst {
0% { left: 0; }
100% { left: -110%;}
}
@keyframes rotaryBlockSecond {
0% { left: 110%; }
100% { left: 0; }
}
@media screen and (max-width: 1250px) {
@keyframes rotaryBlockFirst {
0% { left: 0; }
css特效文字
100% { left: -1200px;} /*1200px为⽂本的长度，利⽤多媒体查询，当屏幕宽度太⼩时，就设置滚动距离为⽂本的长度*/    }
@keyframes rotaryBlockSecond {
0% { left: 1200px; }
100% { left: 0; }
}
}