老师有没有需要改进的地方?

来源:7-7 编程练习

浅浅199

2020-03-26 21:16:21

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8" />

    <title>Document</title>

    <style>

        canvas{background-color:#000;opacity:0.7}

    </style>

</head>

<body>

    <canvas id="canvas" width="500px" height="500px">

        您的浏览器不支持canvas

    </canvas>

    <script>

var canvas = document.getElementById('canvas');

var ctx = canvas.getContext('2d');

ctx.save();

ctx.shadowOffsetX = 3;

ctx.shadowOffsetY = 3;

ctx.shadowBlur = 10;

ctx.shadowColor = "rgba(241,233,23,.7)";

ctx.arc(60,60,25,0,Math.PI*2,true);

ctx.fillStyle = "yellow";

ctx.fill();

ctx.restore();


ctx.save();

ctx.beginPath();

ctx.moveTo(0, 500);

ctx.quadraticCurveTo(62, 135, 90, 500);  

ctx.lineWidth = 6;    

ctx.strokeStyle = "#9171a8";   

ctx.stroke();

ctx.moveTo(74, 500);

ctx.quadraticCurveTo(81, 255, 186, 500);

ctx.stroke();

ctx.moveTo(186, 500);

ctx.quadraticCurveTo(208, 96, 313, 500);

ctx.stroke();

ctx.moveTo(247, 500);

ctx.quadraticCurveTo(426, 118, 496, 500);

ctx.shadowOffsetX = 3;

ctx.shadowOffsetY = 3;

ctx.shadowBlur = 10;

ctx.shadowColor = "rgba(145,113,168,.7)";

ctx.stroke();

ctx.restore();


ctx.beginPath();

ctx.shadowOffsetX = 5;

ctx.shadowOffsetY = 10;

ctx.shadowColor = "rgba(217,215,213,.7)";

ctx.shadowBlur = 5;

ctx.font = "bold 40px 华文行楷";

ctx.fillStyle = "#c9c8c7";

ctx.fillText("山高月小",250,150);

</script>

</body>

</html>


写回答

1回答

好帮手慕星星

2020-03-27

同学你好,代码绘制效果很棒,不需要修改啦。继续加油,祝学习愉快!

0

0 学习 · 6815 问题

查看课程