麻烦老师帮我看下代码有哪些改进的地方,谢谢老师
来源:3-8 编程练习
小屁鹤
2019-11-05 14:33:25
<!DOCTYPE html>
<html>
<head>
<title>机器人</title>
<meta charset="utf-8">
<style type="text/css">
canvas{
background-color: lightpink;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="600px" height="600px">
您的浏览器不支持canvas
</canvas>
<script type="text/javascript">
var myCanvas = document.getElementById('myCanvas');
var ctx = myCanvas.getContext('2d');
// 脸
ctx.strokeRect(200,120,200,100);
// 眼睛
ctx.arc(250,160,20,0,2*Math.PI,true);
ctx.stroke();
ctx.beginPath();
ctx.arc(350,160,20,0,2*Math.PI,true);
ctx.stroke();
// 嘴巴
ctx.beginPath();
ctx.strokeRect(275,190,50,20);
// 耳朵
ctx.strokeRect(180,140,20,50);
ctx.strokeRect(400,140,20,50);
// 天线
ctx.moveTo(250,120);
ctx.lineTo(170,20);
ctx.stroke();
ctx.beginPath();
ctx.moveTo(350,120);
ctx.lineTo(430,20);
ctx.stroke();
// 身体
ctx.strokeRect(240,220,120,150);
// 胳膊
ctx.strokeRect(90,250,150,20);
ctx.strokeRect(360,250,150,20);
// 腿
ctx.strokeRect(260,370,25,200);
ctx.strokeRect(315,370,25,200);
</script>
</body>
</html>
1回答
同学你好!
代码效果实现的是可以的。
如果帮到了你,欢迎采纳,祝学习愉快~
相似问题
回答 1
回答 1