html5 实例渐变

代码实例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>实例</title>
    <script>
        window.onload=function() {
               var canvas=document.getElementById('canvas');
               var ctx=canvas.getContext('2d');
               //渐变的位置
                var colorObj=ctx.createLinearGradient(0,0,100,0);
                //颜色的变化
                colorObj.addColorStop(0,"blue");
                colorObj.addColorStop(1,"green");
                ctx.fillStyle= colorObj;
                 ctx.fillRect(0,0,100,100);



        ctx.putImageData(imgData,0,0);
        }
    </script>
</head>
<body>
<canvas  ></canvas>
</body>
</html>

　　效果：
html5 实例渐变

2017-09-12 09:51:31

2021-05-17
2021-04-27
2021-04-24
2021-07-20
2021-10-17
2022-12-23