HTML5-Canvas

Canvas简介

<canvas> 是 HTML5 新增的元素，可使用JavaScript脚本来绘制图形。例如：画图，合成照片，创建动画甚至实时视频处理与渲染。

示例，使用CanvasRenderingContext2D.fillRect()方法的简单例子.

HTML

<canvas id="canvas"></canvas>

JavaScript

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

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

其中，fillStyle定义了颜色，fillRect四个参数分别为（x轴、y轴、width、height）

教程：

基本用法