canvas

<canvas>

<canvas>元素可被用来通过脚本（通常是JavaScript）绘制图形。

属性

本元素支持 全局属性.

height该元素占用空间的高度，以 CSS 像素（px）表示，默认为 150。

注意事项

可替代的内容

你可以（也应该）在<canvas>块内提供备用内容。该内容将在不支持画布的旧浏览器和禁用JavaScript的浏览器中呈现。

需要</canvas> 标签

不同于 <img> 元素,  <canvas>元素需要有闭合标签 (</canvas>).

设置画布(canvas)的大小

可以通过CSS来控制<canvas>的大小。在渲染的过程中<canvas>元素中的内容会根据情况缩放来适应需要的大小。如果您发现<canvas>元素中展示的内容变形，您可以通过<canvas>自带的height和width属性进行相关设置，而不要使用CSS。

示例

这个代码片段为您的HTML文档添加一个画布元素。如果浏览器无法渲染画布，或者无法读取画布，则会提供后备文本。提供有用的后备文本或子DOM，更易于访问画布。

<canvas id="canvas" width="300" height="300">
  An alternative text describing what your canvas displays. 
</canvas> 

如果你没有设置<canvas>元素的透明度，可以考虑使用moz-opaque属性。下面给出的示例代码可用于页面渲染优化。但需要您注意的是，这个属性目前还没有被推广开来，只能在基于Mozilla内核的浏览器内生效。

<canvas id="myCanvas" moz-opaque></canvas>

规范

浏览器兼容性