画布设置（style设置宽高和直接写canvas的宽高）的不同

[chdyiboke]

默认的画板、画布的宽和高是都是300*150的。

[chdyiboke]

设置style属性，都会拉伸(修改画板宽高) 情况一：

canvas｛
    width: 500px;
    height: 500px;
 ｝

或者 行间样式中的 style=”” 情况二：

canvas.style.width = "500px";
canvas.style.height = "500px";

相当于把画板的宽和高改变了，画布的宽和高还是默认值，所以画布会出现拉伸的情况。

---

直接设置宽和高相当于是同时修改了画板和画布的宽和高，所以在画布上画的图形不会出现拉伸： 情况一：

<canvas width="500" height="500"></canvas>

或者 行间样式中的 style=”” 情况二：

canvas.width = 500;
canvas.height = 500;