CodePen Embed - canvas rect

<canvas id="myCanvas" width="300" height="300"></canvas>

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

context.fillStyle = "#FF0000";  //填滿顏色
context.strokeStyle = '#0000ff'; //邊框顏色

context.fillRect(0,0,150,50);  //填滿顏色的矩形，前面兩個數字為起點座標，後面兩個數字為長寬
context.strokeRect(0,60,150,50);  //只有框線的矩形

This Pen is owned by deathhell on CodePen.

See more by @deathhell on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.