代刷网文字打字效果代码

王宏利 2020/02/02 09:35:20

代刷网文字公告装修美化方法可以有改变文字的大小,颜色以及渐变,这次是改变它的出场方式,这个文字像是一个一个打出来的一样,所以称他为打字效果!演示效果如下:

资源分享屋 http://www.zyfxw.net/



代码:

<center> 
<style type="text/css">
  #type{
        color:#ff0000;      /*这里修改文字颜色*/
        width:500px;	/*这里修改文字长度*/
        white-space:nowrap;
        overflow:hidden;
        -webkit-animation: dy 5s steps(60, end) infinite;
        animation: dy 5s steps(50, end) infinite;/*这里修改文字时间(5s)*/
    }
    @-webkit-keyframes dy{
        from { width: 0;}
    }
    @keyframes dy{
        from { width: 0;}
    }
</style>
 <p id="type">资源分享屋 http://www.zyfxw.net/</p>
</center>

加到自己喜欢的地方就行

优站网https://www.youzhan9.com/