1、打开vscode，新建一个html文件，在文件中输入一个感叹号，再按一下tab键，就能快速完成html5规范的文档结构（使用文本文件编辑也是一样的效果）
2、在body范围内添加一个canvas标签，设置宽高与边框。在浏览器中运行可以看到，罕铞泱殳canvas标签中间的文字并没有显示在浏览器中，这个文字是当浏览器不支持canvas的时候显示的
3、在页面中添加js代码，获取页面canvas标签对象，再判断当浏览器支持canvas标签时，获取canvas绘制2d，即平面图形的对象
4、在js中继续添加画图代码，从canvas左上角（0，0）坐标开始，到（150，150）坐标之间的直线。 注意：moveTo(0, 0)的意思就是设置画线的起点坐标
5、在浏览器中运行页面，就可以看到canvas范围内出现了一条从左上角开始的直线
6、修改moveTo(0, 0)，变成从左上角开始(50, 50)的位置为起点坐标，其他代码都不修改
7、再次打开浏览器，运行可以看到canvas图形中的起点，距离左上角有横向50，纵向50的偏移了
