如何根据设备规格计算视口宽度

Ada*_*myd 5 css mobile viewport responsive-design

我试图了解如何计算移动设备的视口宽度。我已经在真实设备上尝试过,它的工作原理相同,但我将使用模拟器粘贴屏幕截图。

问题是:当设备宽度为1080px、密度为420dpi时,为什么视口宽度为432px?我不明白视口元标记应该将视口宽度设置为设备实际宽度,对吗?那么它应该是 1080px 是吗?

这可能是微不足道的,但我不明白 432px 到底是从哪里来的。

截屏: 在此输入图像描述

小智 2

ViewPortSize = ScreenPixelResolution / DevicePixelRatio
Run Code Online (Sandbox Code Playgroud)

例如:iPhone XS Max

屏幕像素分辨率:2688 x 1242

设备像素比:3

视口尺寸:896 x 414

  • 从哪里获取“DevicePixelRatio”?我不认为它是设备规范的一部分。 (2认同)