画布上的填充风格

你的浏览器不支持画布(Canvas).

我们可以通过新的HTML5画布（Canvas）标签添加一个画布到网页中，以下代码用于定义一个 800 x 600 大小的画布。

你的浏览器不支持画布(Canvas).
					

再通过以下 JavaScript 代码控制在画布中的绘图。

// 通过ID取画布元素
var mc = document.getElementById("MyCanvas");
if(mc.getContext)
{
	// 创建 context 对象
	var ctx = mc.getContext("2d");

	// 填充整个画布
	for(var i=0;i<5;i++)
	{
		for(var j=0;j<5;j++)
		{
			// 每块颜色
			ctx.fillStyle = 'rgb(' + Math.floor(255 - 51*i) + ',' + Math.floor(255 - 51*j) + ', 0)';

			// 填充每块
			ctx.fillRect(i*160, j*120, 160, 120);
		}
	}
}
					

返回目录