演示代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="reset.css"/>
        <style type="text/css">
            .box{
                width: 1000px;
                height: 200px;
                border: 1px solid #000;
                margin: 100px auto;
                
                /* 以下演示从左到右重复线性渐变,重复2次 */
                /* 重复渐变最后一个颜色必须设置百分比,表示 占整个元素尺寸的百分比 */
                /* 通过最后一个百分比,可以计算重复次数 */
                /* background: repeating-linear-gradient(90deg,red,green,blue 50%); */
                /* background: repeating-linear-gradient(90deg,red,green 30%,blue 50%); */
                background: repeating-radial-gradient(circle,red,green,blue 50%);
            }
        </style>
    </head>
    <body>
        <div class="box"></div>
    </body>
</html>
打开支付宝首页搜“559920739”领红包,领到大红包的小伙伴赶紧使用哦! (如果你觉得本文不错,请扫描下面二维码随意打赏哦)
最后修改:2020 年 09 月 14 日
如果觉得我的文章对你有用,请随意赞赏