iphone - Iphone4 および 5 シミュレーターで拡大/縮小された背景 ? プレーンな HTML5 および CSS3 コードの使用

Question

iphone4 と 5 用の HTML5 アプリを開発しています。テクスチャが豊富な背景があります。このテクスチャ画像を追加しようとすると、拡大縮小されて中央部分だけが表示されます。画像サイズは 640x960 と 640x1136 です。最後に @2x を追加した後でも、まだスケーリングされており、画像全体を表示したいです。以下のコードを見つけてください-

コード：

 <div id="container" data-role="page" class="login_bg">
  <section class="main" data-role="none">
....

....
 </section>
</div>

CSS:

@media all and (min-width: 640px) and (max-height: 960px){

    .login_bg {
        width:100%; 
        height:960px;
        background-image:url(../../img/Bg_960@2x.png);  
        background-repeat:no-repeat;
        background-position: top center;
        background-size:cover; 
    }

}


@media all and (min-width: 640px) and (max-height: 1136px){

.login_bg {
    width:100%; 
    height:1136px;
    background-image:url(../../img/Bg_1136@2x.png);     
    background-repeat:no-repeat;
    background-position: top center;
    background-size:cover;
}

}