Html 如何正确使用iPhone4/5的媒体查询

我正在为iPhone开发一个应用程序。现在，我有三个图像，我想以正确的方式显示

• 闪屏
• 进入屏幕
• 背景图像

所有这些都是图像（）

我必须缩放它们，因为iPhone

<div data-role="page" id="start">
   <a href="#start1" data-transition="fade">
      <div class="main_pic_splash"></div>
   </a>      
</div>

CSS:

/*iPhone<5*/
@媒体屏幕和设备（宽高比：2/3）{
.main_picu_飞溅{
背景：url（../img/splash/splash960.png）；
背景尺寸：320px 480px；
显示：块；
}
}
/*iPhone5*/
@媒体屏幕和设备（宽高比：40/71）{
.main_picu_飞溅{
背景：url（../img/splash/splash1136.jpg）；
背景尺寸：320px 568px；
显示：块；
}
}

我不能让它工作。。。我只是没有显示图像。希望你能帮助我，告诉我，我的错误在哪里：-/

KR

---

你忘了引用

我仍然认为这可能是对他的问题的回答。他的

@media

查询在我看来很好，但不是url…我真的忘了引用。真蠢！非常感谢。

/*iPhone < 5*/
    @media screen and (device-aspect-ratio: 2/3) {
       .main_pic_splash {
         background:url(../img/splash/splash960.png);
         background-size: 320px 480px;
         display: block;
       }
}

/*iPhone 5*/
    @media screen and (device-aspect-ratio: 40/71) {
       .main_pic_splash {
            background:url(../img/splash/splash1136.jpg);
            background-size: 320px 568px;
            display: block;
       }
}

background:url('../img/splash/splash1136.jpg');