fillStyle 属性设置或返回用于填充绘画的颜色、渐变或样式
fillStyle
var c = document.getElementById('mycanvas');
var ctx = c.getContext('2d');
ctx.beginPath();
ctx.fillStyle = "#00f";
ctx.fillRect(20,20,150,100);
strokeStyle 属性设置或返回用于笔触的颜色、渐变或模式。
strokeStyle
var c2 = document.getElementById('mycanvas2');
var ctx2 = c2.getContext("2d");
ctx2.beginPath();
ctx2.strokeStyle="#00f";
ctx2.strokeRect(20,20,150,100);
shadowBlur 属性设置或返回阴影的模糊级数 -- number
shadowColor 属性设置或返回用于阴影的颜色.默认值为#000;
shadowBlur和shadowColor
var c3 = document.getElementById("mycanvas3");
var ctx3 = c3.getContext("2d");
ctx3.shadowBlur= 20 ;
ctx3.shadowColor="black";
ctx3.fillStyle = "#00f";
ctx3.fillRect(20,20,150,100);
shadowOffsetX设置或返回阴影距形状的水平距离 -- number
shadowOffsetY设置或返回阴影距形状的垂直距离 -- number
shadowOffsetX和shadowOffsetY
var c4 = document.getElementById("mycanvas4");
var ctx4 = c4.getContext('2d');
ctx4.shadowBlur = 10;
ctx4.shadowOffsetX = 20;
ctx4.shadowOffsetY = -20;
ctx4.shadowColor = "black";
ctx4.fillStyle = "#00f";
ctx4.fillRect(20,20,150,100);