Phonegap，480x720,480x800和480x854的CSS样式问题

Question

我已经工作了好几天来解决Phonegap的CSS问题。

我有一个应用程序显示地图和一些控制按钮。我需要设置地图大小，以便我有足够的余地。

它适用于大多数屏幕分辨率，但对于480x720,480x800和480x854，它对我来说不适用于三种不同的风格。我在这里看到了其他有半个问题，但仍有问题。三种屏幕分辨率选择相同的风格。

例如，这适用于480x720：

  

@media screen和（min-device-width：455px）和（max-device-width：   720px）和（方向：肖像）{/ *样式* /}

     

块引用

然后480x800选择相同的造型。 如果我然后为480x800创建一个新样式：

  

@media only screen and（min-device-width：480px）and（orientation：   肖像）{/ *样式* /}

然后它适用于480x800，但480x720也可以使用它。

我尝试了很多不同的东西，min-device-width，max-device-width等。另外我无法弄清楚为什么（min-device-width：455px）适用于480x720（找到它{{3} }）

任何帮助将不胜感激:)

Answer 1

这只是我的头脑，但我相信你需要做这样的事情：

@media screen and (max-device-width: 480px) and (max-device-height: 720px) and (orientation: portrait)
@media screen and (max-device-width: 480px) and (max-device-height: 800px) and (orientation: portrait)
@media screen and (max-device-width: 480px) and (max-device-height: 854px) and (orientation: portrait)

为每种屏幕分辨率提供正确的样式。