23 lines
583 B
HTML
23 lines
583 B
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<title>Canvas HTML5</title>
|
|
<style>
|
|
#canvas {
|
|
border: 1px solid black;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<canvas id="canvas" width="640" height="640">Not Supported</canvas>
|
|
<script>
|
|
const canvas = document.querySelector('#canvas');
|
|
const ctx = canvas.getContext("2d");
|
|
ctx.fillStyle = "red";
|
|
ctx.fillRect(100, 100, 500, 300); //filled shape
|
|
ctx.strokeRect(90, 90, 520, 320); // outline
|
|
ctx.clearRect(150, 150, 400, 200); //transparent
|
|
</script>
|
|
</body>
|
|
</html>
|