渲染大小和显示大小有什么区别答案

【问题标题】：What is the difference between render size and display size渲染大小和显示大小有什么区别
【发布时间】：2017-11-08 14:19:01
【问题描述】：

渲染尺寸（宽度和高度）和显示尺寸（style.width和style.height）有什么区别

即使我将其更改为 px，它仍然不一样。

<canvas id="chart_0" height="40vw" width="80vw"></canvas>

<canvas id="chart_0" style="height:40vh; width:80vw">

【问题讨论】：

style width vs width attribute in HTML的可能重复
canvas.width & canvas.height 设置分辨率并始终以像素为单位，不应使用 CSS 单位类型（例如好的width="300"）进行后期修复。糟糕width="300vw" 分辨率是图像包含的像素数。 canvas.style.width & canvas.style.height 设置显示大小（画布在页面上占据的空间量）并且与画布分辨率无关。显示尺寸必须采用任何有效的 CSS 单位。

【解决方案1】：

height="" 和 width="" 是 HTML，不使用“视图高度”或“视图宽度”，仅使用固定大小。

vh 和 vw 仅在 CSS 中使用。

【讨论】：