SOURCE

const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');

// 背景
function drawBG() {
    ctx.fillStyle = "rgba(255,0,0,1)";
    ctx.fillRect(0, 0, 600, 400);
    ctx.fillStyle = "#f3f5f7";
    ctx.fillRect(2, 2, 596, 396);
}
// 字
function drawText() {

    ctx.font = '18px serif';
    ctx.fillText('Hello world', 5, 20);

}

drawBG()

drawText()

<!-- <div id="canvas"></div> -->
<div>
    <canvas id="canvas" height="400" width="600"></canvas>
</div>

div{
    height: 60vh;
    background-color:  bisque;
}