HTML canvas shadowColor 属性

由网友 大卫 发布 阅读 6

HTML canvas shadowColor 属性

shadowColor属性用于设置阴影的颜色。默认值为#000000

HTML canvas 参考手册

在线示例

看一个示例来实现canvas的shadowColor属性:

您的浏览器,不支持HTML5 canvas标签.

下面演示绘制一个蓝色长方形:

<!DOCTYPE html>
<html>
<head>
<title>HTML canvas shadowColor 属性的使用(大卫编程网 div.cn)</title>
</head>
<body>
<canvas id="newCanvas" width="250" height="120" style="border:1px solid #d3d3d3;">
您的浏览器不支持 HTML5 canvas 标签
</canvas>
<script>
   var c = document.getElementById("newCanvas");
   var ctx = c.getContext("2d");
   ctx.shadowBlur = 20;
   ctx.shadowColor = "gray";
   ctx.fillStyle = "blue";
   ctx.fillRect(40, 40, 200, 100);
</script>
</body>
</html>
测试看看 ‹/›

浏览器兼容性

IEFirefoxOperaChromeSafari

Internet Explorer 9、Firefox、Opera、Chrome 和 Safari 支持 shadowColor 属性。

注意:Internet Explorer 8 及之前的版本不支持 <canvas> 元素。

定义和用法

shadowColor属性设置或返回用于阴影的颜色。

注意:请将 shadowColor 属性与 shadowBlur 属性一起使用,来创建阴影。

提示:请通过使用 shadowOffsetXshadowOffsetY 属性来设置阴影效果。

默认值:#000000
JavaScript 语法:context.shadowColor=color;

属性值

描述
color用于阴影的 CSS 颜色值。默认值是 #000000。
HTML canvas 参考手册

HTML canvas shadowBlur 属性 HTML canvas fillStyle属性