canvas元素的大小与绘图表面积的大小

canvas元素实际上有两套尺寸，一个是元素本身的大小，还有一个是元素绘图表面的大小。当设置
元素的width和height属性时，实际上同时修改了该元素本身的大小与元素绘图表面的大小。然而如
果通过CSS来设定canvas元素的大小，那么只会改变元素本身的大小，而不会影响到绘图表面。当元
素的大小不符合绘图表面的大小时，浏览器就会对绘图表面进行缩放

Canvas状态的保存与恢复

Canvas的API提供了两个名叫save()和restore()的方法，用于保存及恢复当前canvas绘图环境的
所有属性。绘图环境的save()方法将当前的绘图环境压入栈顶顶部。对应的restore()方法则会从堆
栈顶部弹出一组状态信息，并据此恢复当前绘图环境的各个状态。
save():将当前的canvas状态推送到一个保存canvas状态的堆栈顶部。canvas状态包括了当前的坐
标变换信息，剪辑区域以及所有canvas绘图环境对象的属性，包括strokeStyle、fillStyle、与
globalCompositeOperation等，canvas状态并不包括当前的路径或位图。只能通过beginPath()
来重置路径
restore():将canvas状态堆栈顶部的条目弹出。原来保存于栈顶的那一组状态，在弹出之后，就被
设置成canvas当前的状态了，因此，在调用save()和restore()方法之间，对canvas状态所进行的
修改，其效果只会持续至restore()方法调用之前