无限循环色卡

2021-03-01 10:04:06 阅读：220 来源： 互联网

标签：random 无限循环 let 色卡 font 256 Math size

无限循环色卡

<!DOCTYPE html>
<html lang="ch-zn">
<head>
    <meta charset="UTF-8">
    <title>moban</title>

    <style>
    html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu{margin:0;padding:0;}
    header,footer,section,article,aside,nav,hgroup,address,figure,figcaption,menu,details{display:block;}
    table{border-collapse:collapse;border-spacing:0;}
    caption,th{text-align:left;font-weight:normal;}
    html,body,fieldset,img,iframe,abbr{border:0;}
    i,cite,em,var,address,dfn{font-style:normal;}
    [hidefocus],summary{outline:0;}
    li{list-style:none;}
    h1,h2,h3,h4,h5,h6,small{font-size:100%;}
    sup,sub{font-size:83%;}

    #wrap span{
        float: left;
        margin: 5px;
        width: 150px;
        height: 40px;
        /* background-color: coral; */
        
        line-height: 40px;
        text-align: center;
        font-size: 12px;
        font-weight: bold;
        color: black;

    }


    </style>

</head>
<body>

    <div id="wrap"></div>



    <script src='https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js'></script>
    <script>

        (function () {
                //获取标签权限
            let Wrap = document.getElementById("wrap")

            ;

            //添加定时器
            setInterval(function(){
                //随机颜色
                let WrapColor = randomColor()
                //添加span标签样式
                Wrap.innerHTML += `<span style="background-color: ${WrapColor}">${WrapColor}<span>`;

            },1000)

            //封装随机数函数
            function randomColor(){

                let r = Math.floor(Math.random()*256);

                let g = Math.floor(Math.random()*256);

                let b = Math.floor(Math.random()*256);

                return `rgb(${r},${g},${b})`;

            }


        })();

    </script>
</body>
<!--
笔记区域




-->

</html>

标签：random,无限,循环,let,色卡,font,256,Math,size
来源： https://www.cnblogs.com/yhy-blog/p/14462022.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

无限循环色卡

无限循环色卡