<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Gamedev Canvas Workshop - lesson 1: create the Canvas and draw on it</title>
<style>* { padding: 0; margin: 0; } canvas { background: #eee; display: block; margin: 0 auto; }</style>
</head>
<body>
<canvas id="myCanvas" width="480" height="320"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.rect(120, 90, 50, 50);
ctx.fillStyle = "#FFBB00"; (改變顏色的地方!!!)
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.arc(200, 180, 20, 0, Math.PI*2, false);
ctx.fillStyle = "red";
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.rect(240, 90, 50, 50);
ctx.fillStyle = "#FFBB00";
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.rect(130, 215, 155, 20);
ctx.fillStyle = "#DDDDDD";
ctx.fill();
ctx.closePath();
</script>
</body>
</html>
---------------------------------------------------------------------------------------
課程1:
第一課主要是在教學如何改變 (X軸，Y軸，長，寬) ，以及改變顏色，還有改變形狀>.^
色碼表網站:色碼表
沒有留言:
張貼留言