如何将window ppi与screen ppi匹配？

Question

我正在开发HTML5游戏以匹配设备的屏幕，就像本地移动应用程序一样，我有一个视口元数据，它声明了宽度为device-width并防止缩放，例如：

<meta name = 'viewport' content = 'width = device-width, user-scalable = 0'/>

还有一个脚本来调整画布的大小以匹配窗口：

canvas.width = window.innerWidth;
canvas.height = window.innerHeight;

我遇到的问题是，当我在1080p智能手机上测试游戏时，图形明显模糊；结果发现我的画布尺寸（纵向）为424×829。然后，我删除了设备宽度，然后我的网页以纵向显示980×1915（有点偏离），然后以横向显示980×371，这仅比设备宽度好一点。如何使其与屏幕的像素密度匹配？谢谢。 更新：明确地说，我没有麻烦将画布安装到窗口中，也没有使窗口与屏幕分辨率匹配（例如，在1080像素宽的屏幕上为1080像素宽，而不是980或424）

Answer 1

我认为您的问题的答案是：只需将画布的宽度设置为100vw，将高度设置为100vh。