zoukankan      html  css  js  c++  java
  • (六)阴影

    shadowColor = "rgba(0,0,0,0.5)" 【设置阴影的颜色】
    shadowOffsetX = 5 【px,设置阴影x轴的偏移量】
    shadowOffsetY = 5 【设置阴影y轴的偏移量】
    shadowBlur = 5 【设置阴影的模糊程度】

    var canvas = document.getElementById("canvas");
        if(canvas.getContext){
            var ctx = canvas.getContext("2d");
            ctx.beginPath();
    
    
            ctx.fillStyle = "red";//填充颜色
            ctx.shadowColor = "grey";//阴影颜色
            ctx.shadowOffsetX = 10;//x轴偏移量 px
            ctx.shadowOffsetY = 10;//y轴偏移量
            ctx.shadowBlur = 5;//阴影的模糊程度
            ctx.save();//保存以上设置 一级
    
            ctx.fillStyle = "green";
            ctx.shadowColor = "rgba(0,0,0,.4)";
            ctx.shadowOffsetX = 10;
            ctx.shadowOffsetY = 10;
            ctx.shadowBlur = 8;
            ctx.save();//保存以上设置 二级
    
            ctx.restore();//恢复 二级 设置
            ctx.fillRect(50,50,100,50);
    
            ctx.restore();//恢复 一级 设置
            ctx.fillRect(100,80,100,50);
    
            ctx.stroke();
            ctx.closePath();
        }
  • 相关阅读:
    每日日报46
    每日日报45
    每日日报44
    每日日报43
    每日日报42
    每日日报41
    每日日报40
    每日日报之一周总结
    每日日报
    每日日报
  • 原文地址:https://www.cnblogs.com/chefweb/p/6046477.html
Copyright © 2011-2022 走看看