Canvas

Canvas 中文翻译为：画布。

<canvas id=”yourCanvasId” width=”300” height=”150” />

Canvas

Canvas - 01 body{ background #canvas{ margin padding background border width height Canvas not supported ), ctx ); ctx.font; ctx.fillStyle; ctx.strokeStyle; ctx.fillText(); ctx.strokeText();

我们期望的结果是这样的： 

而实际的执行结果：

其实我认为可以这样理解它，它是一个放映布，因为真正的绘图不在它上的，而是在一个绘图板上，绘图完毕投影到放映布上。这一点，类似于我们中学时候用过的幻灯片放映机，在一张玻璃板（绘图板）上写上习题，然后投影到放映布或者白墙上（画布）。

 所以呢，这样一想，就明白了，当css

Canvas 元素目前有三个方法：

通过getContext(“2d”);

 通过getContext(“3d”);

在随后的文章里，将会学习使用Canvas画图的必要知识。

CanvasRenderingContext2D API 详情：

https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D