最后更新：2026-09-12

<canvas>画布标签

通过 JavaScript 在网页上绘制图形、动画、图表（2D 或 WebGL），本身只是一个空白画布，内容由脚本生成。

📝 语法

<canvas width="300" height="150"></canvas>

该元素支持全局属性及以下专有属性：

属性	值	描述
`width`		画布宽度（像素），默认 300。
`height`		画布高度（像素），默认 150。

编辑下方代码，在 playground 中查看实时效果：

浏览器	Chrome	Edge	Firefox	Safari	Opera
<canvas>	✓ v1	✓ v12	✓ v1	✓ v1	✓ v1
所有主流浏览器均支持

提示： canvas 本身没有绘图能力，必须用 JavaScript 的 getContext 才能画；要适配高分屏可结合 CSS 缩放。

更多案例即将上线，敬请期待。

Web-Tutorial 技术团队

由多位开发者共同维护的编程教程平台。每篇教程由对应领域的开发者编写和审核，确保内容准确可靠。如发现任何问题，欢迎向我们反馈。