2011-09-16 7 views
2

現在、HTML5ページを表示できる電話機ギャップアプリを開発中です。 HTMLページは、内容と画像でいっぱいになる表で構成されています。デバイスにロードされますが、ロードされたページが画面に収まらない。 HTML要素の幅を100%に設定しましたが、ページはまだ画面から消えます。Phonegapアプリケーションの表示サイズが正しくない

<body onload="MM_preloadImages('images/index_54-.png','images/index_52.png','images/index_53-.png','images/index-_54.png')"> 
<table width="100%" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td class="dibu"><table width="100%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
    <td align="center"><a href="index.html" target="neirong" onmouseover="MM_swapImage('Image4','','images/index_52.png',1)" onmouseout="MM_swapImgRestore()"><img src="images/index_52-.png" name="Image4" width="128" height="117" border="0" id="Image4" /></a></td> 
    <td align="center"><a href="tssd.html" target="neirong" onmouseover="MM_swapImage('Image5','','images/index_54-.png',1)" onmouseout="MM_swapImgRestore()"><img src="images/index_53.png" name="Image5" width="128" height="117" border="0" id="Image5" /></a></td> 
    <td align="center"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','images/index_53-.png',1)"><img src="images/index_54.png" name="Image6" width="128" height="117" border="0" id="Image6" /></a></td> 
    <td align="center"><a href="zxxx.html" target="neirong" onmouseover="MM_swapImage('Image7','','images/index-_54.png',1)" onmouseout="MM_swapImgRestore()"><img src="images/index_55.png" name="Image7" width="128" height="117" border="0" id="Image7" /></a></td> 
    </tr> 
</table></td> 
</tr> 
</table> 
</body> 

ご協力いただければ幸いです。

答えて

0

どのデバイスをターゲットに設定していますか?ブラウザが表を作成するための幅を明示的に知るように、本文の幅を100%に設定していることを確認する必要があります。すべてのテーブルの親DOMノードを確保する

html, body { 
    width: 100%; 
    height: 100%; 
    padding: 0; 
    margin: 0; 
} 

は、既知のサイズのものであり、そのテーブルを適切にレンダリングすることができます。試してみるもう1つの方法は、ヘッダーにメタタグを追加して、モバイルデバイス(ターゲティングしているものと仮定しているもの)が正しいディスプレイサイズを設定していることを確認することです。

<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1"/> 

あなたのハードそのサイズに画面をコーディングすることができ、あなたのために行くの幅を知っていれば。

<meta name="viewport" content="user-scalable=no, width=480, initial-scale=1, minimum-scale=1, maximum-scale=1"/> 

おそらく正しいデバイスのためのあなたのCSS(iPhoneの3G .V。iPhone 4)などを対象とするメディアクエリを使用する必要があります

関連する問題