老师,这样可以吗
来源:5-7 编程练习
慕丝5187111
2018-11-04 11:05:31
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>canvas渐变</title> <style> canvas{background-color:black;} </style> </head> <body> <canvas id="canvas" width="800px" height="800px">您的浏览器不支持</canvas> <script> var canvas=document.getElementById("canvas"); var context=canvas.getContext("2d"); //在此处补充代码 var radialGradient = context.createRadialGradient(500,400,0,400,400,100); radialGradient.addColorStop(0,'#fff'); radialGradient.addColorStop(0.2,'#f00'); radialGradient.addColorStop(0.7,'rgba(255,255,255,0.7)'); radialGradient.addColorStop(1,'#000'); context.fillStyle = radialGradient; context.arc(400,400,100,0,2*Math.PI,true); context.fill(); </script> </body> </html>
1回答
经测试实现效果是可以的,建议开始白色部分可以模糊一些,如下:
祝学习愉快!