JSFiddle - React, Tailwind, and code Playground

by zhangchi

HTML

<canvas id="myCanvas" width="400" height="200">
你的浏览器不支持canvas!
</canvas>

JavaScript

var canvas = document.getElementById('myCanvas');

if (canvas.getContext) {
  var ctx = canvas.getContext('2d');
}

ctx.shadowOffsetX = 10;
ctx.shadowOffsetY = 10;
ctx.shadowBlur = 5;
ctx.shadowColor = 'rgba(0,0,0,0.5)';

ctx.save();



ctx.fillStyle = '#CC0000';
ctx.fillRect(10,10,150,100);

ctx.restore(); //恢复之前的状态

ctx.fillStyle = '#000000';
ctx.fillRect(180,10,150,100);