canvas 画矩形(前端)

最新推荐文章于 2024-08-20 03:01:37 发布

better body

最新推荐文章于 2024-08-20 03:01:37 发布

阅读量677

点赞数

分类专栏：前端

本文链接：https://blog.youkuaiyun.com/wqewq19/article/details/81298148

版权

前端专栏收录该内容

18 篇文章

订阅专栏

<html>
  <head>
    <title>Canvas tutorial</title>
    <script type="text/javascript">
      function draw(){
        var canvas = document.getElementById("canvas");
        if(canvas.getContext){
          var ctx = canvas.getContext("2d");

          ctx.fillStyle="rgb(0,0,0)";
          ctx.fillRect(10,10,100,100);

           ctx.clearRect(20,20,80,80);

           ctx.fillRect(30,30,60,60);

             ctx.clearRect(40,40,40,40);

            ctx.fillRect(50,50,20,20);



        }
      }
    </script>

  </head>
  <body onload="draw();">
    <canvas id="canvas" width="150" height="150"></canvas>

  </body>
</html>