canvas是HTML5中的新元素，你可以使用javascript用它来绘制图形、图标、以及其它任何视觉性图像。它也可用于创建图片特效和动画。
首先这是一个灰太狼，你可以在网上随便找一张图片，然后放在PS软件下下测量每个坐标，我是在网上找的，你也可以在网上看看一些大神怎么用canvas代码来实现动漫的。如果你想画的特么特么的精确，那你一定的去测量好每个坐标，每个指定点。
<canvas id="box" width="600px" height="600"></canvas>
样式写在行内是因为他的权重最高，同时也是因为他有一个默认值。
如果不写在行内，就会被默认值覆盖掉。
var cxt=box.getContext("2d");这句话意思实在canvas下展现的是一个2D效果，相当于一块画布，而canvas相当于一只画笔在上面任由你操控在上面画任何图像。
Canvas有很多命令，
我在这里展示一下画鼻子的过程，
//鼻子
cxt.beginPath() ;
cxt.moveTo(190,212) ;
cxt.bezierCurveTo(150,214,150,246,190,246) ;
//贝赛尔曲线,fx1,fy1,为控制点1，dx2,dy2,为控制点2，x1,y1为结束坐标
建议大家可以去网上好好的看看贝赛尔曲线，刚开始我也不懂，看了之后才基本明白，不懂得可以看看这个图片，相信会让你有更深的映像。
他还有一个兄弟：
cxt.bezierCurveTo(240,260,230,254,190,234) ;
这是填充颜色
cxt.fillStyle="forestgreen";
填充颜色之后必须加上cxt.fill()
cxt.fill() ;
这是开始
cxt.beginPath() ;
还是颜色
cxt.fillStyle = '#fff' ;
这是起点的x,y轴坐标
cxt.moveTo(145,567) ;
cxt.quadraticCurveTo(180,245,180,224);
cxt.quadraticCurveTo(171,234,119,246);
cxt.fill() ;
既然有开始，肯定会有结束，
结束标签又称闭合标签：ctx.closePath();这个标签视情况而定。有的地方是不需要的。
尤其是每次画完之后得加上ctx.stroke();，不加的话会看不到。
给大家整理了一小段代码助于大家理解//画嘴唇那里
cxt.beginPath();
cxt.strokeStyle="palevioletred";
cxt.moveTo(123,253) ;
cxt.quadraticCurveTo(193,275,272,253) ;
cxt.moveTo(123,253);
cxt.bezierCurveTo(124,300,259,288,272,253)
cxt.stroke();
首先我的思路是先从他的嘴左上角的耳朵开始画起，
先开始上半身，在是下半身。不过每个人都有每个人的思路。
你可以把整个人物分成很多很多小块来进行绘画。这样比较容易的多，你也不会轻易混饶了。
大家可以多多在网上查看一些大神所写的，canvas是一个很神奇的标签，
但IE不兼容，这点要注意一下。
（吐槽接受中...）