用canvas画一个房子

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<script type="application/javascript">
function draw() {
var canvas = document.getElementById('canvas');
if (canvas.getContext) {
var ctx = canvas.getContext('2d'); ctx.fillStyle = 'rgba(0, 0, 200, 0.5)';
ctx.fillRect(120, 120,200, 200);
ctx.beginPath(); ctx.fillStyle='#000'
ctx.moveTo(220, 20);
ctx.lineTo(90, 140);
ctx.lineTo(350, 140);
ctx.fill();
}
}
</script>
<style type="text/css">
canvas { border: 1px solid black; }
</style>
</head>
<body onload="draw();">
<canvas id="canvas" width="500" height="500"></canvas>
</body>
</html>

  效果图:

用canvas画一个房子

上一篇:Android Studio发布Release版本之坑--Unknown host 'd29vzk4ow07wi7.cloudfront.net'


下一篇:Word 2007 文档结构图混乱