画布的大小是它在页面上占据的区域，由CSS width和height属性定义。
canvas {
width : 1000px;
height : 1000px;
}画布分辨率定义了它包含的像素数。通过设置画布元素的width和height属性来设置分辨率。如果未指定，则画布默认为300 x 150像素。
下面画布将使用上述CSS大小，但作为width和height未指定的分辨率将300 150。
<canvas id="my-canvas"></canvas>
这将导致每个像素不均匀地拉伸。像素长宽比为1：2。当画布被拉伸时，浏览器将使用双线性过滤。这具有使伸展的像素模糊的效果。
为了在使用画布时获得最佳效果，请确保画布分辨率与显示尺寸匹配。
从上面的CSS样式开始，以匹配显示尺寸，添加带有width和的画布，并将其height设置为与样式定义相同的像素数。
<canvas id = "my-canvas" width = "1000" height = "1000"></canvas>