在使用<canvas>标签时通常都会设置宽高。而设置<canvas>的宽高有两种方式：
1、在<canvas>标签中直接定义宽高。这种方式是指定可以绘画的区域大小。例如：
<canvas id="drawing" width="200" heigth="200"></canvas>
说明：
- 这种方式定义宽高时不用加单位。
- <canvas>标签直接定义的width和height是绘画区域实际宽度和高度，绘制的图形都是在这个上面。
- 若是未定义宽高或值不正确，则会被设置成默认的width:300px、height:150px（可使用getComputedStyle在浏览器中查看）。
2、在style中定义宽高。例如：
//css
.canvas{
width:200px;
heigth:200px;
//other style
}
//html
<canvas id="drawing" class="canvas"></canvas>
说明：
style的width和height是<canvas>在浏览器中被渲染的高度和宽度。
通过style设置宽高可能引起的问题
- 若未定义<canvas>标签的宽高而定义了style的宽高，则<canvas>标签中绘制的图片会进行拉伸，与预期效果不符。
- 若同时定义了<canvas>标签的宽高和style的宽高，则以style的宽高为准。
