老师请检查
来源：3-8 编程练习
蒜泥辣椒麻油加醋酱
2019-08-15 09:19:30
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>canvas</title>
<style>
canvas{background-color:lightblue;}
</style>
</head>
<body>
<canvas id="canvas" width="800" height="800">
您的浏览器不支持canvas
</canvas>
<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
// 天线
ctx.moveTo(200,100);
ctx.lineTo(250,200);
ctx.strokeStyle = "#000";
ctx.stroke();
ctx.beginPath();
ctx.moveTo(400,100);
ctx.lineTo(350,200);
ctx.strokeStyle = "#000";
ctx.stroke();
// 脸部轮廓
ctx.strokeRect(200,200,200,120);
// 眼睛
ctx.beginPath();
ctx.arc(250,240,10,0,2*Math.PI,true)
ctx.strokeStyle = "#000";
ctx.stroke();
ctx.beginPath();
ctx.arc(350,240,10,0,2*Math.PI,true)
ctx.strokeStyle = "#000";
ctx.stroke();
// 嘴巴
ctx.strokeRect(260,270,80,26);
// 耳朵
ctx.strokeRect(170,235,30,50);
ctx.strokeRect(400,235,30,50);
// 身体
ctx.strokeRect(230,320,140,200);
// 手臂
ctx.strokeRect(80,380,150,20);
ctx.strokeRect(370,380,150,20);
// 腿
ctx.strokeRect(250,520,20,200);
ctx.strokeRect(330,520,20,200);
//在此处写出代码
</script>
</body>
</html>
1回答
-
同学你好，
代码实现效果很棒！继续加油~
0
