day11

又是一天

<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<canvas id="mycans" width="500" height="500" ></canvas>
<canvas id="mycans1" width="500" height="500" ></canvas>
<canvas id="mycans2" width="500" height="500" ></canvas>
</body>
</html>
<script>
var lw=document.getElementById("mycans");
var lw1=lw.getContext("2d");
lw1.rect(0,0,400,400);
lw1.stroke();
lw1.fillStyle="#e1e1ff";
lw1.fillRect(0,0,400,400);
lw1.beginPath();
lw1.arc(200,200,80,0.5*Math.PI,1.5*Math.PI,true);
lw1.fillStyle="#ffffff";
lw1.fill();
lw1.stroke();
lw1.beginPath();
lw1.arc(200,200,80,1.5*Math.PI,0.5*Math.PI,true);
lw1.fillStyle="#000000";
lw1.fill();
lw1.stroke();
lw1.beginPath();
lw1.arc(200,160,40,1.5*Math.PI,0.5*Math.PI,true);
lw1.fillStyle="#ffffff";
lw1.fill();
lw1.stroke();
lw1.beginPath();
lw1.arc(200,240,40,0.5*Math.PI,1.5*Math.PI,true);
lw1.fillStyle="#000000";
lw1.fill();
lw1.stroke();
lw1.beginPath();
lw1.arc(200,160,5,0,2*Math.PI,true);
lw1.fillStyle="#000000";
lw1.fill();
lw1.stroke();
lw1.beginPath();
lw1.arc(200,240,5,0,2*Math.PI,true);
lw1.fillStyle="#ffffff";
lw1.fill();
lw1.stroke();
lw1.save();
lw1.fillStyle="#ffffff";
lw1.globalAlpha="0.4";
lw1.textAlign="center";
lw1.font="32px Arial";
lw1.shadowColor="#2a7fa8";
lw1.shadowOffsetX=15;
lw1.shadowOffsetY=-10;
lw1.shadowColor=2;
lw1.fillText("魏来芳",200,100);


var lw2=document.getElementById("mycans1");
var lw3=lw2.getContext("2d");
var grd=lw3.createLinearGradient(0,0,300,300)
grd.addColorStop(0,"#eec102");
grd.addColorStop(0.5,"#ffffff");
grd.addColorStop(1,"#78bd48");
lw3.fillStyle=grd;
lw3.fillRect(0,0,300,300);

var lw4=document.getElementById("mycans2");
var lw5=lw4.getContext("2d");
var grd=lw5.createRadialGradient(100,100,100,200,200,50)
grd.addColorStop(0,"#eec102");
grd.addColorStop(0.2,"#ffffff");
grd.addColorStop(0.4,"red");
grd.addColorStop(0.6,"blue");
grd.addColorStop(0.8,"black");
grd.addColorStop(1,"#78bd48");
lw5.fillStyle=grd;
lw5.fillRect(0,0,300,300);



 


</script>

posted @ 2017-04-08 19:33  lwboke  阅读(74)  评论(0)    收藏  举报