文字彩色特效代码

这个文字彩色特效代码挺好看的，适合做信封、句子啥滴！文字彩色特效代码采用的是HTML+CSS+JS，如果不要颜色边框的话，删除CSS即可。现在分享给大家吧！

代码：

<html>
    <head>
<style type="text/css">
    .text_body{margin:100px auto;background-color:white;}.text{position:relative;margin:100px auto;padding:1em;border:1em solid transparent;background:linear-gradient(white,white) padding-box,repeating-linear-gradient(-45deg,red 0,red 12.5%,transparent 0,transparent 25%,#58a 0,#58a 37.5%,transparent 0,transparent 50%) 0 / 5em 5em;}</style>
    </head>
    <body>
<!--文本-->
        <div class="text_body">
            <div class="text" id="container">
                初恋是让人难忘，觉得美好。为什么？不是因为他/她很漂亮或很帅，也不是因为得不到就是好的，而是因为人初涉爱河时心理异常纯真，绝无私心杂念，只知道倾己所有去爱对方，而以后的爱情就没有这么纯洁无暇了。纯真是人世间最可贵的东西，我们可求的就是它。
            </div>
        </div>
<!--文本结束-->
<script type="text/javascript">
var text = $("#container").text().trim();
        $("#container").html("");
        for(var i = 0;i < text.length;i++){
            $("#container").append("<span>"+text[i]+"<\/span>")
        }
        var s = 0;
        var tim = setInterval(function(){
            $("#container span").eq(s++).css("color",getColor()).show();
            if(s == text.length){
                clearInterval(tim)
            }
        }, 100)
        function getColor(){
            return "rgb("+Math.floor(Math.random()*255)+","+Math.floor(Math.random()*255)+","+Math.floor(Math.random()*255)+")";
        }
        </script>
    </body>
</html>

效果：

初恋是让人难忘，觉得美好。为什么？不是因为他/她很漂亮或很帅，也不是因为得不到就是好的，而是因为人初涉爱河时心理异常纯真，绝无私心杂念，只知道倾己所有去爱对方，而以后的爱情就没有这么纯洁无暇了。纯真是人世间最可贵的东西，我们可求的就是它。

更多精彩文章，请关注“星语的小木屋”>>>

温馨提示：本文最后更新于2020-11-22 13:40:45，已超过925天没有更新。某些文章具有时效性，若文章内容或图片资源有错误或已失效，请在下方留言或联系星语社长。谢谢！

感谢您的来访，获取更多精彩文章请收藏本站。

版权声明 1 本网站名称：星语的小木屋
2 本站永久网址：https://www.wiiuii.cn
3 本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长QQ1431258805进行删除处理。
4 本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
5 本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报
6 本站资源大多存储在云盘，如发现链接失效，请联系我们我们会第一时间更新。

THE END