| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| </head> | |
| <body> | |
| <canvas id="canvas" width="700" height="500" style="width: 700px; height; 500px;"></canvas> | |
| <script> | |
| let canvas = document.getElementById("canvas"); | |
| let context = canvas.getContext("2d"); | |
| context.fillStyle = "magenta"; | |
| context.fillRect(200, 20, 100, 100); | |
| context.fillStyle = "aqua"; | |
| context.fillRect(220, 20, 20, 100); | |
| context.fillStyle = "green"; | |
| context.fillRect(200, 120, 300, 100); | |
| </script> | |
| </body> | |
| </html> |