<section class="preview">
</section>
<canvas width="480" height="320">
</canvas>
p {
color: purple;
margin: 0.5em 0;
}
* {
box-sizing: border-box;
}
canvas {
border: 1px solid black;
}
const canvas = document.querySelector('canvas');
const ctx = canvas.getContext('2d');
const x = 50;
const y = 60;
const width = 100;
const height = 75;
const color = 'blue';
function drawRect(){
ctx.clearRect(0,0,canvas.width,canvas.length);
ctx.fillStyle = color;
ctx.fillRect(x,y,width,height);
}
drawRect();
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.