实例讲解使用HTML5 Canvas绘制阴影效果的方法

context.strokeStyle = "RGBA(0, 255, 0, 1)"; context.lineWidth = 2;

context.strokeText("Blur Canvas", 40, 80);

// section two - shadow font var hh = canvas.height/4;

context.fillStyle="white"; context.fillRect(0, hh, canvas.width, canvas.height/4);

context.font = '60pt Calibri';

context.shadowColor = "RGBA(127,127,127,1)"; context.shadowOffsetX = 3;

context.shadowOffsetY = 3; context.shadowBlur = 0;

context.fillStyle = "RGBA(0, 0, 0, 0.8)"; context.fillText("Blur Canvas", 40, 80+hh);

// section three - down shadow effect

var hh = canvas.height/4 + hh; context.fillStyle="black";