canvas入门之画线

<canvas id="canvas" style="display:block;margin:50px auto;"></canvas>

在hmtl代码中创建好canvas之后，就可以在js里面对canvas进行操作了

     var canvas=document.getElementById("canvas");     
     var context=canvas.getContext("2d");     //获取绘图上下文环境
     canvas.width=500;                        //设置画布宽高
     canvas.height=300;
     
     context.strokeStyle="#DBEAF9";       //设置绘制的线条颜色
     context.moveTo(0,0);                 //设置绘制的起点
     context.lineTo(300,300);             //设置绘制的终点
     context.stroke();                    //调用专门绘制线条的函数stroke()