7-2的练习题
来源：7-2 编程练习
慕函数3468989
2018-11-25 11:18:51
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Document</title>
<style>
canvas{background-color:lightblue;}
</style>
</head>
<body>
<canvas id="canvas" width="800px" height="800px">
您的浏览器不支持canvas
</canvas>
<script>
var canvas=document.getElementById("canvas");
var context=canvas.getContext("2d");
//在此处补充代码
context.arc(400,400,100,0,2*Math.PI,true);
context.clip();
context.fillStyle='#90ee90';
context.fillRect(300,300,100,100);
context.fillStyle='#800080';
context.fillRect(400,300,100,100);
context.fillStyle='#ffa500';
context.fillRect(300,400,100,100);
context.fillStyle='#ffc0cb';
context.fillRect(400,400,100,100)
</script>
</body>
</html>
1回答
-
好帮手慕星星
2018-11-26
效果图中可以看到圆是有边框的，绘制完圆之后可以填充一下：
整体效果是不错的，继续加油！
0
