更改视口 - 硬件像素缩放

Question

如何使浏览器内容（chrome 44.0.2403.155 m）的像素与我的物理屏幕（笔记本电脑）的像素一致？

我对前端开发完全陌生，只是在花费数小时生成特定大小的图像后，发现浏览器屏幕中的（虚拟？）像素与我的物理图像不一致屏幕硬件。 关于响应式设计有很多材料，但在我正在做的事情中没有用户体验。我需要的是我的浏览器中的像素与我的屏幕上的像素一致。

我试过了两个 <meta name="viewport" content="width=1920">（1920px是我的屏幕宽度） 和 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 但我没有看到任何变化，即使我使用这些数字也没有（这个视口元标记是否只适用于移动设备？）。 我还了解到存在window.screen对象以及window.screen.height和window.screen.width，但它们是只读的。

Answer 1

在尝试了很多事情之后我找到了答案： 我的浏览器像素与物理屏幕像素之间没有1：1比例的原因是我的Windows 10设置为扩展所有内容：

采用此X％设置，浏览器将其屏幕宽度设置为

(Physical Screen Width) / X%

就我而言，那是1920px / 150% = 1280px

将此设置更改为100％后，我在浏览器和屏幕像素之间得到一对一的对比。

我在StackOverflow中也发现viewport metatag不会影响非移动（桌面，笔记本电脑，......）设备浏览器。我希望我在官方文件中找到了这个答案。

Does Viewport affect desktop browsers?

How do desktop browsers handle mobile meta tags?