HTML5 画布

标签：

HTML5 Canvas 画布
1.Canvas是一个块级标签。自带width: height: 属性 不用再CSS上写，不用写PX；
getContext:获取上下文，只有canvas才有的属性；可以称之为画笔；

2.var cs=document.getElementById("cs");获取画布
var context=cs.getContext("2d");获取画笔

3.绘制矩形

带填充内容的
context.fillRect(10,10,100,50)x,y,width,height;
有边框没有填充内容的矩形
context.strokeRect(10,10,100,50)

画笔颜色(红色)
填充画笔 context.fillStyle="red";
没有填充画笔 context.strokeStyle="red";
绘制阴影
阴影程度： context.shadowBlur=15;
阴影颜色： context.shadowColor="black";
绘制有渐变的图形

context.rect(10,10,100,50)有了路径，
重置所有的设置
context.restore();

绘制图片，要加路径
var img1=new Imag();

quadraticCurveTo() 方法通过使用表示二次贝塞尔曲线的指定控制点，向当前路径添 加一个点。
开始点：moveTo(20,20)
控制点：quadraticCurveTo(20,100,200,20)
结束点：quadraticCurveTo(20,100,200,20)

HTML5 画布

标签：

原文地址：http://www.cnblogs.com/luoyao19910515/p/4805730.html