Safari 中针对不同 iOS 设备的不同主体（Cordova/phonegap）答案

【问题标题】：different body in safari for different iOS device (Cordova/phonegap)Safari 中针对不同 iOS 设备的不同主体（Cordova/phonegap）
【发布时间】：2014-07-02 07:52:18
【问题描述】：

我正在使用cordova/phonegap 开发一个只有横向的游戏。

游戏在适合屏幕的游戏画布中，虽然它在 iPhone4 分辨率下非常适合，但在 iPhone5 上测试时却不适合。

发生的情况是它适合屏幕的长度，因此部分游戏画布隐藏在底部。

我想要的是让它适合屏幕，即使它在屏幕两侧制作黑色边框。

我该怎么做？

PS：

我也在为 iPad 开发它，但在 iPad 上我没有问题，因为它会自动设置黑色边框并适合它，所以我不能使用它（这不符合条件）：

body {
  -webkit-touch-callout: none;                /* prevent callout to copy image, etc when tap to hold */
  -webkit-text-size-adjust: none;             /* prevent webkit from resizing text to fit */
  -webkit-user-select: none;                  /* prevent copy paste, to allow, change 'none' to 'text' */
  width: 640px;
  height: 960px;
  overflow: hidden;
  margin: 0px;
  padding: 0px;
  background: #000;
  style="position: absolute;
}

【问题讨论】：

标签： javascript ios css cordova mobile-safari

【解决方案1】：

我不了解应用程序开发 - 但我知道 iphone 4 和 5 有 88 像素的高度差。

对于网页设计，需要使网站具有响应性（CSS 媒体查询和 Javascript）

但我不知道这对于游戏设计是否也一样......

只要搜索响应式设计就有很多教程:)

希望这会有所帮助。

【讨论】：