老师,看一下
来源:3-11 编程练习
慕函数3468989
2018-11-23 14:34:21
<!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 cts=canvas.getContext('2d');
cts.moveTo(300,50);
cts.lineTo(373,185);
cts.moveTo(444,187);
cts.lineTo(517,50);
cts.lineWidth='8';
cts.strokeStyle='#ffc019';
cts.stroke();
cts.lineWidth='1';
cts.beginPath();
cts.fillStyle='#ffdab9'
cts.fillRect(300,187,217,135);
cts.fillStyle='#000000';
cts.arc(358,240,16,0,2*Math.PI);
cts.arc(459,240,16,0,2*Math.PI);
cts.fill();
cts.fillStyle='red';
cts.fillRect(372,270,70,30);
cts.beginPath();
cts.fillStyle='yellow';
cts.fillRect(270,212,30,55);
cts.fillRect(517,212,30,55);
cts.fillStyle='#ffb6c1';
cts.fillRect(336,323,146,202);
cts.fillStyle='#20b2aa';
cts.fillRect(120,388,216,33);
cts.fillRect(483,388,216,33);
cts.fillRect(357,525,30,200);
cts.fillRect(430,525,30,200);
</script>
</body>
</html>
1回答
好帮手慕星星
2018-11-23
经测试代码实现的效果没有问题,继续加油!