css完成滚动文字的案例代码
网页的本质就是超级文本标记语言，通过结合使用其他的Web技术（如：脚本语言、公共网关接口、组件等），可以创造出功能强大的网页。因而，超级文本标记语言是万维网（Web）编程的基础，也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言，是因为文本中包含了所谓“超级链接”点。
本篇文章给大家带来的内容是关于css实现滚动文字的实例代码，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。效果图
图片描述：箭头指向部分，以白色为背景，从左向右滚动。（不适用于IE）
代码
html
<div> 例子： <div class="box"> <span class="box-text">滚动的文字，我是滚动的文字</span> </div> </div>
CSS
.box {
height: auto;
background-color: blue;
}
.box-text{
color: white;
background: -ms-gradient(linear,left top,right top,color-stop(0,#4d4d4d),color-stop(.4,#4d4d4d),color-stop(.5,#fff),color-stop(.6,#4d4d4d),color-stop(1,#4d4d4d));
background: -webkit-gradient(linear,left top,right top,color-stop(0,#4d4d4d),color-stop(.4,#4d4d4d),color-stop(.5,#fff),color-stop(.6,#4d4d4d),color-stop(1,#4d4d4d));
background-clip: text;
-webkit-text-fill-color: transparent;
animation: slidetounlock 3s infinite;
-webkit-animation: slidetounlock 3s infinite;
}
@-webkit-keyframes slidetounlock{
0% {
background-position:-200px 0
}
100% {
background-position:200px 0
}
}