Question

我正在测试Chrome移动模拟器（iPhone 6）和Xcode iOS模拟器中的PhoneGap应用程序（使用Framework7框架）的布局。但是，我无法匹配两个模拟器的垂直布局。

Chrome模拟器的CSS分辨率为375x627，（我假设）相当于750x1254，设备的像素比率为“2”。

我无法理解的是，即使屏幕顶部有20个CSS像素空间用于状态栏（40个设备像素），为什么Chrome移动模拟器仍然没有iPhone 6的原生1334像素高度？

Chrome模拟器的高度似乎是（627x2）+（20x2）= 1294 ......短40个像素？我读错了数字，还是Chrome的iPhone 6设备配置文件不正确？

Answer 1

Chrome移动模拟器用于检查html和css，但它不会读取任何配置。

在config.xml中，您可以设置状态栏的行为：

<preference name="StatusBarOverlaysWebView" value="true">

如果设置为true，那么您的html正文将从屏幕顶部开始，您必须为其添加20px填充，否则您的内容中会显示状态栏。

如果设置为false，则正文从状态栏下方开始。