canvas画图标签的使用
<canvas id="can" width='500' height='500'>你的浏览器不支持</canvas> //创建一个画布
js:
var c=document.getElementById('can') //获取节点
var canvas=c.getContext("2d"); //使用2D引擎
canvas.fillStyle="rgba(0,0,255,0.2)"; //定义一个颜色
canvas.fillRect(0,0,300,300); //定义一个矩形
========画线========
canvas.moveTo(10,10) //起始位置 //如果没有再次设置起始位置将从结束位置开始画
canvas.lineTo(20,30) //结束位置
canvas.stroke(); //结束图形
=========画圆=======
canvas.fillStyle="rgba(0,0,255,0.2)"; //定义一个颜色
canvas.beginPath(); //从新开始画,防止冲突重叠
canvas.arc(200,200,30,0,Math.PI*2,true)
canvas.closePath(); //结束画布
canvas.fill(); //结束渲染
var grd=canvas.createLinearGradient(0,0,175,50);
grd.addColorStop(0,"yellow");
grd.addColorStop(0.5,"blue");
grd.addColorStop(0.5,"green");
canvas.fillStyle=grd; //将生成的颜色赋值给样式
canvas.fillRect(0,0,175,50);
============载入一张图片==============
var img=new Image()img.src='logo.png';canvas.drawImage(img,200,30)