canvas之一：绘制直线
canvas是html5中最激动人心的技术之一，使用它，可以在浏览器上绘制出各种酷炫的效果，但是呢，千里之行，始于足下，接下来我们就从画一条最简单的直线开始，话不多说，先上效果图：
代码如下：
代码详解：
1.首先我们需要一个
2.然后我们要在js中获取这个canvas对象，var canvas = document.getElementById("canvas")这行代码就是啦！
3.接下来再使用var context = canvas.getContext("2d")获取到canvas的绘图上下文，这个东西有什么用呢？以后绘图我们都要通过它来进行哦~
4.我们通过context.moveTo(100,100)把画笔移动到(100,100)这个点开始进行绘制。
5.context.lineTo(700,700)表示在上个点和这个点(700,700)直接画一条直线。
6.context.lineWidth = 5和context.strokeStyle = "red"这两行设置了画笔的一些属性：线条的宽度和颜色。
7.做完以上步骤以后，实际上我们只是设置好了绘制一条直线所需的所有状态，但此时画布上仍然是一片空白，关键的一步在这里：context.stroke()，它实实在在地在画布上画出了一条直线给我们看，感觉很酷炫有木有~