CSS和JS两种颜色渐变文字效果代码

迟 晓涛 0

渐变文字效果[aru_31]

这是JS的效果[aru_39]

这是CSS的效果[aru_38]

js实现颜色渐变文字效果代码:

<div id="chixiaotao">
        <div style="text-align:center;">
            这是JS的效果
        </div>
    <script language="javascript">
    function changeColor(){ var color="#f00|#0f0|#00f|#880|#808|#088|yellow|green|blue|gray"; color=color.split("|"); document.getElementById("chixiaotao").style.color=color[parseInt(Math.random() * color.length)]; } setInterval("changeColor()",200); </script>
</div>

CSS实现颜色渐变文字效果代码:

<div id="chixiaotao">
    <div style="text-align:center;">
            这是CSS的效果
        </div></div>
<style>
#chixiaotao{animation:change 10s infinite;font-weight:100; }
@keyframes change{0%{color:#5cb85c;}25%{color:#556bd8;}50%{color:#e40707;}75%{color:#66e616;}100% {color:#67bd31;}}
</style>
广告

打赏
发表评论 取消回复
表情 图片 链接 代码

分享
微信
微博
QQ