canvas

（1）先在body里边写一个canvas标签并且规定宽度和高度

（2）在js里边获取canvas标签并设置2d构图环境getContent("2d");

（3）绘制直线：

txt.beginPath();//开始绘制

txt.lineWidth=10//规定线条的宽度

txt.strokeStyle = "red";//规定线条颜色

txt.moveTo(x,y)//直线起始坐标

txt.lineTo(x,y)//直线终点坐标

txt.stroke();//绘制矩形

txt.closePath();//结束绘制

（4）绘制矩形：

txt.beginpPath();//开始绘制

txt.strokeStyle = "red";//规定线条颜色

txt.strokeRect(10,10,200,200)//规定矩形的开始坐标(10,10)规定矩形的宽度和高度(200,200);

//填充一个矩形

txt.fillStyle = "blue";

txt.fillRext(100,100,200,200);

txt.beginPath();//结束绘制