tango238/canvas.html

## canvas.html
<!DOCTYPE HTML>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>Canvas</title>
<style>
#canvas {
    border: #000 1px solid;
}
</style>
</head>
<body>
<section>
	<header>
		<h1>Canvas</h1>
	</header>
	<article>
        <canvas id="canvas"></canvas>
    </article>
<script>
(function(){
    // Contextを取得
    var ctx = document.getElementById("canvas").getContext("2d");
    // 三角形を描く
    ctx.beginPath();
    ctx.moveTo(50, 10);
    ctx.lineTo(90, 90);
    ctx.lineTo(10, 90);
    ctx.closePath();
    // 三角形を塗りつぶす
    ctx.fill();
})();
</script>
</section>
</body>
</html>
	<!DOCTYPE HTML>
	<html lang="ja">
	<head>
	<meta charset="UTF-8">
	<title>Canvas</title>
	<style>
	#canvas {
	border: #000 1px solid;
	}
	</style>
	</head>
	<body>
	<section>
	<header>
	<h1>Canvas</h1>
	</header>
	<article>
	<canvas id="canvas"></canvas>
	</article>
	<script>
	(function(){
	// Contextを取得
	var ctx = document.getElementById("canvas").getContext("2d");
	// 三角形を描く
	ctx.beginPath();
	ctx.moveTo(50, 10);
	ctx.lineTo(90, 90);
	ctx.lineTo(10, 90);
	ctx.closePath();
	// 三角形を塗りつぶす
	ctx.fill();
	})();
	</script>
	</section>
	</body>
	</html>