Galaxy Nexus忽略视口元标记

我正在构建一个PhoneGap应用程序。 我的应用程序设计为320px接口。 我在应用中的视口标记是:

 

这在我的Galaxy S2运行冰淇淋三明治上的预期效果。 320px接口填充整个屏幕宽度。

但是,在Galaxy Nexus上测试上述代码时,视口宽度为360px。 所以我的元素没有填满屏幕。 我尝试将以下行添加到Cordova的appname.java文件中:

 this.appView.getSettings().setUseWideViewPort(true); 

但是,这没有效果。

尝试用这个替换它:

  

它应resize到特定设备,但我无法测试。

我看到的答案非常接近,但他们忽略了他提出的一点:他的界面设计为320px。 width = device-width将使其适合屏幕,但这并不能确保他的界面将保持在320px。

我的解决方案只是在Wayneio的答案上构建一点,提供必要的CSS /标记,以确保您只需要一个样式表(并且它不需要是响应式样式表)。

      
// insert interface here

此标记的作用是允许您将接口限制为可以通过CSS设置属性的特定容器。 我建议的是这样的:

 #interfaceWrap { position: relative; width: 320px; margin-left: auto; margin-right: auto; } 

这基本上告诉浏览器,无论元标记视口设置页面宽度,将我的界面放在水平中心( margin-left & margin-right: auto )并将其固定为320px宽度( width: 320px )。 您可以添加任何样式组合以获得您真正想要的内容。

希望这可以帮助!

用这个

  

检查此演示文稿以自定义元标记