绘制字体时可以使用fillText方法或者strokeText方法。
fillText方法用填充的方式来绘制字符串
context.fillText (text, x,y,[maxwidth]);
strokeText方法用轮廓的方式来绘制字符串.
context.strokeText (text, x,y,[maxwidth]);
第一个参数text表示要绘制的文字，
第二个参数x表示要绘制的文字的起点横坐标，
第三个参数y表示要绘制的文字的起点纵坐标，
第四个参数maxwidth 为可选参数，表示显示文字的时候最大的宽度，可以防止文字溢出
在body的属性里面，使用onload="draw('canvas' )“语句，调用脚本文件中的draw函数进行图形绘画
画布的创建方法：指定 id ， width（画布宽度）， height（画布高度）
创建一个画布，长度为800，高度为300
1 <body onload="draw('canvas')">
2 <canvas id="canvas" width="800" height="300" ></canvas>
3 </body>
引入一个名为canvas的is脚本，js脚本的语言编码是utf-8
1 function draw(id){
2 var canvas = document.getElementById(id);
3 var context = canvas.getContext('2d'); //获取对应的2D对象(画笔)
4 context.fillStyle = 'green'; //设置填充的背景颜色
5 context.fillRect(0,0,800,300); //绘制 800*300 像素的已填充矩形：
6 context.fillStyle = '#fff';
7 context.strokeStyle = '#fff'; //设置笔触的颜色
8 context.font = "bold 40px '字体','字体','微软雅黑','宋体'"; //设置字体
9 context.textBaseline = 'hanging'; //在绘制文本时使用的当前文本基线
10 context.fillText('欢迎收看' ,10 ,40); //设置文本内容
11 context.fillText('《canvas轻松入门》',40,110);
12 context.fillText('视频教程',580,180);
13 }
context.textBaseline = 'hanging';
属性值可以是top（顶部对齐）
hanging（悬挂） middle（中间对齐） bottom（底部对齐） alphabetic是默认值