我使用 html5+JQueryMobile + Phonegap 开发我的第一个混合应用程序...我正在三星 w (android 2.3.3)、Iphone 4s 和 Iphone5 的 IphoneSimulator 上测试应用程序...在主页我'想为此设备使用不同的背景图像...我正在尝试使用 CSS 媒体查询...
/* IPHONE 4 - IPHONE 3*/
@media screen and (height: 480px) {
#home {
background-image:url(images/home/home_Med.png);
background-size: auto 100%;
}
}
/* GALAXY S1 - S2 */
@media screen and (width: 480px) {
#home {
background-image:url(images/home/home_Small.png);
background-size: auto 100%;
}
}
/* GALAXY S3 - IPHONE 5*/
@media screen and (height: 568px),screen and (height: 1280px) {
#home {
background-image:url(images/home/home_Big.png);
background-size: auto 100%;
}
}
媒体查询与不同的 Iphone 完美配合......但是当我在我的三星 W(480x800,如 S1 和 S2)或 Galaxy S3 ADV 上测试时,它不起作用......我试图做很多不同的媒体查询...当我使用 with:320 for the Samsung W it Works!!!....可能我不了解有关 android 设备分辨率的信息...有人可以解释一下吗?!谢谢