html设置了字体为什么没效果,为什么设置字体没效果，楷书不行么

html>

Document

canvas{background-color:#000;opacity:0.7}

您的浏览器不支持canvas

var canvas=document.getElementById("canvas");

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

// 在此处补充代码

//通用阴影的统一设置

context.shadowOffsetX = 5;

context.shadowOffsetY = 10;

context.shadowBlur = 10;

//月亮

context.save();

context.fillStyle = '#e9f435';

context.shadowColor = 'rgba(236,253,77,.5)';

context.arc(100,100,50,0,2*Math.PI);

context.fill();

context.restore();

//贝塞尔曲线

context.save();

context.beginPath();

context.shadowColor = 'rgba(90,94,155,.5)';

context.lineWidth = 5;

context.strokeStyle = 'rgb(90,94,155)';

context.translate(0,1000);

//1

context.moveTo(0,0);

context.quadraticCurveTo(100,-600,300,0);

context.stroke();

//2

context.moveTo(280,0);

context.quadraticCurveTo(200,-500,500,0);

context.stroke();

//3

context.moveTo(500,0);

context.quadraticCurveTo(600,-700,700,0);

context.stroke();

//4

context.moveTo(680,0);

context.quadraticCurveTo(1000,-600,1200,0);

context.stroke();

context.restore();

//文字

var str = '山高月小';

context.fillStyle = '#fff';

context.shadowColor = '#fff';

context.font = 'bold 50px 楷书';

context.fillText(str,800,200);