为什么要在HTML5中使用canvas标签？

指定画布的高度。HTML<canvas>标记用于使用脚本绘制图形，动画等。HTML5中引入的<canvas>标签。

让我们看一个简单的<canvas>元素，它具有两个特定的属性width和height以及所有核心HTML5属性，例如id，name和class等。

<canvas id="myCanvas" width="100" height="100"></canvas>

这是属性-

属性	值	描述
高度	像素	指定画布的高度。
宽度	像素	指定画布的宽度。

示例

您可以尝试运行以下代码，以了解如何使用画布创建矩形。canvas元素具有一个称为getContext的DOM方法，该方法获取渲染上下文及其绘图功能。此函数采用一个参数，即上下文2d的类型。

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Canvas Tag</title>
   </head>
   <body>
      <canvas id = "myCanvas"></canvas>
      <script>
         var c = document.getElementById('myCanvas');
         var ctx = c.getContext('2d');
         ctx.fillStyle = '#7cce2b';
         ctx.fillRect(0,0,300,100);
      </script>
   </body>
</html>

基础教程