css - 像素宽度将如何看待更高的分辨率

Question

如果我将网站上的所有宽度都设置为 1920px

它在更高的分辨率(例如 4k)下看起来如何？它会只填充网站的一部分，而将其余部分留白(因为这是我缩小时发生的情况)吗？

我想我真正想问的是:如果我将整个网站视为一张图片，我能否一次按比例缩放它？

编辑:经过一些研究和尝试，我根据需要将宽度设置为 100% 并设置 View 高度 (vh) 来解决此问题。

Answer 1

根据CSS3 values spec , px 是一个绝对物理长度，应该映射到近似真实世界的尺寸:

The reference pixel# is the visual angle of one pixel on a device with a pixel density of 96dpi and a distance from the reader of an arm’s length. For a nominal arm’s length of 28 inches, the visual angle is therefore about 0.0213 degrees. For reading at arm’s length, 1px thus corresponds to about 0.26 mm (1/96 inch).

这意味着设备本身应该为显示适本地缩放您的 px 测量值 - 就 4k 而言，您可能会看到每个 CSS 像素有 4 个物理像素。不过，这通常是用户可在操作系统中配置的，因此不能保证。

虽然硬编码网站的宽度通常不是一个好主意 - 当浏览器不是全屏时会发生什么？它如何出现在移动设备上？您应该考虑使用 relative length units像 % 和 em 使您的布局更加灵活并适应这些情况。