Html5 Canvas 简单示例

回复
头像
vicyang
版主
版主
帖子: 56
注册时间: 2016年07月21日 20:35
联系:

Html5 Canvas 简单示例

帖子 vicyang »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Canvas</title>
</head>

<body onload="main()">
<canvas id="example1" width="400" height="400">
Please use a browser that supports "canvas"
</canvas>
<script>
function main()
{
var canvas = document.getElementById('example1');
if (! canvas )
{
console.log('Failed to retrieve the <canvas> element');
return;
}

var ctx = canvas.getContext('2d'); // 注意是小写'd'

ctx.fillStyle = 'rgba(0, 0, 255, 1.0)';
ctx.fillRect(120, 10, 150, 150);
}
</script>
</body>
</html>
在线浏览代码和效果
http://runjs.cn/code/8r9cqjly
happy886rr
渐入佳境
渐入佳境
帖子: 45
注册时间: 2016年09月27日 16:11
联系:

Re: Html5 Canvas 简单示例

帖子 happy886rr »

:look_around1 vicyang 应该是小号。
头像
PerlMonk
渐入佳境
渐入佳境
帖子: 49
注册时间: 2016年09月19日 10:20
联系:

Re: Html5 Canvas 简单示例

帖子 PerlMonk »

happy886rr 写了::look_around1 vicyang 应该是小号。
you are right

111
上次由 PerlMonk 在 2021年10月12日 14:02,总共编辑 1 次。
回复

在线用户

正浏览此版面之用户: 没有注册用户 和 0 访客