8.1Act1

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

<body>

<canvas id="myCanvas" width="800" height="800" style="boarder:1px solid black";>
</canvas>

<script>

var canvas = document.getElementById("myCanvas");
var drawingTools =canvas.getContext("2d");

drawingTools.fillStyle = "#00ffff";
drawingTools.fillRect(50,5,600,600);

drawingTools.fillStyle = "#0066ff";
drawingTools.fillRect(200,55,100,100);

drawingTools.fillStyle = "#0066ff";
drawingTools.fillRect(400,55,100,100);

drawingTools.fillStyle = "#0066ff";
drawingTools.fillRect(330,225,30,80);

drawingTools.fillStyle = "#0066ff";
drawingTools.fillRect(250,455,200,60);

drawingTools.fillStyle = "#0066ff";
drawingTools.fillRect(450,400,55,55);

drawingTools.fillStyle = "#0066ff";
drawingTools.fillRect(505,345,55,55);

drawingTools.fillStyle = "#0066ff";
drawingTools.fillRect(195,400,55,55);

drawingTools.fillStyle = "#0066ff";
drawingTools.fillRect(140,345,55,55);

drawingTools.fillStyle = "#000000";
drawingTools.fillRect(260,460,180,50);

drawingTools.fillStyle = "#000000";
drawingTools.fillRect(205,65,60,60);

drawingTools.fillStyle = "#000000";
drawingTools.fillRect(405,65,60,60);

drawingTools.fillStyle = "#ffffff";
drawingTools.fillRect(255,115,10,10);

drawingTools.fillStyle = "#ffffff";
drawingTools.fillRect(455,115,10,10);

drawingTools.fillStyle = "#ffffff";
drawingTools.fillRect(270,455,30,30);

drawingTools.lineWidth = 1;
strokeStyle = "black";
drawingTools.strokeRect(40,0,620,610);

</script>
</body>

</html>