canvas的width与height属性的值可不可以带单位？

canvas的width和height属性的值不应该带单位。它们代表canvas绘图区域的像素个数，是整数。虽然某些浏览器可能会容忍你带单位（例如px），但这不被规范所支持，而且可能导致不一致的行为。

最好始终使用不带单位的整数值来设置width和height。例如：

<canvas id="myCanvas" width="500" height="300"></canvas>

这将创建一个宽度为500像素，高度为300像素的canvas。

如果你想用CSS控制canvas元素的大小（例如，让它占据父容器的一定比例），你应该使用CSS的width和height属性，而不是canvas元素自身的width和height属性。 这时，canvas元素自身的width和height属性决定了绘图分辨率，而CSS的width和height属性决定了canvas在页面上的显示大小。

例如：

<canvas id="myCanvas" width="500" height="300"></canvas>

#myCanvas {
  width: 100%;
  height: 50vh;
}

这样，canvas的绘图分辨率仍然是500x300像素，但它会在页面上占据父容器的100%宽度和50%高度。 如果CSS尺寸与canvas的width和height属性不同，浏览器会缩放canvas的内容以适应CSS尺寸。

总结：

• canvas自身的width和height属性：控制绘图分辨率（像素个数），不带单位。
• CSS的width和height属性：控制canvas在页面上的显示大小，可以带单位。

使用不带单位的整数值可以确保canvas在不同浏览器和设备上的一致性，并避免潜在的问题。