canvas绘画----小黄人案例

最新推荐文章于 2024-05-31 10:04:55 发布

李好丫

最新推荐文章于 2024-05-31 10:04:55 发布

阅读量139

点赞数

分类专栏： canvas 文章标签：前端 javascript html

本文链接：https://blog.csdn.net/weixin_58300323/article/details/127416797

版权


<html>
<body>
<canvas id="ok" width="600" height="600" style="border:3px solid #000">
</canvas>
<script>
var c=document.getElementById("ok");
var b=c.getContext("2d");

b.fillStyle="black";//身体
b.fillRect(200,200,200,200);
b.fillStyle="yellow";
b.fillRect(204,200,192,196);


b.fillStyle="black";//头
b.beginPath();
b.arc(300,200,100,3.14,0);
b.closePath();
b.fill();
b.fillStyle="yellow";//头
b.beginPath();
b.arc(300,202,96,3.14,0);
b.closePath();
b.fill();


b.fillStyle="black"
b.beginPath();
b.arc(265,235,35,0,6.28);
b.closePath();
b.fill();

b.beginPath();
b.arc(335,235,35,0,6.28);
b.closePath();
b.fill();

b.fillStyle="#fff"
b.beginPath();
b.arc(265