css 画布输出图片大小 |删除无用css工具

canvas {
width: 200px;
height: 200px;
}

以上代码定义了一个200×200像素的画布，而且它显示在浏览器中的大小与定义的大小相同。这是因为浏览器默认情况下会把画布的大小与CSS中定义的尺寸保持一致。

但是，有时候大家需要以不同的分辨率输出画布，比如为了打印或其他用途。在这种情况下，大家需要指定画布的分辨率（resolution）。

canvas {
width: 200px;
height: 200px;
resolution: 300dpi;
}

代码中的300dpi即代表每英寸的点数（dots per inch），它会影响输出图片的像素密度。在这个例子中，输出图片的大小将是600×600像素，因为大家定义的画布大小是200×200，而此时分辨率是300dpi。

需要注意的是，不是所有浏览器都支持分辨率属性，因此可能需要使用其他方式来生成高分辨率的图片（例如使用JavaScript或后台处理）。同时，大家需要对输出图片的大小进行权衡，因为较大的图片会占用更多的空间和带宽。