PhoneGapの使用中にcssメディアクエリが機能しない

PhoneGapとjs/css3を使用してiPhone/iPadアプリを開発しています。最近、iPadの大きな画面サイズを使用してレイアウトを調整し始めました。私はPhoneGapの使用中にcssメディアクエリが機能しない

@media screen and (min-device-width: 481px) {

と

@media screen and (max-device-width: 480px) {

とiPad専用セクションで、私のCSSのiPhone専用セクションを追加し、私が使用して（デバッグされたとき、彼らは私のデスクトップ上で正常に動作するように見えましたクロム、winとmacの両方、macのsafari）。 xcodeでアプリケーションをビルドしてデバイスで実行したとき、それらのセクション内のすべてのルールは完全に無視され、レイアウトはすべて間違っているようです。

私のためにこの仕事をするには、私が使うべきトリックがありますか？

出典

2011-12-26 Noam Gal

あなたのiPadのみセクションの

@media only screen and (-webkit-min-device-width: 481px) {

を試してみて、私に戻って取得することはできますか？

出典

2012-02-22 15:36:22

あなたのHTMLドキュメントの先頭にビューポートを追加することが重要である：

<html> 
    <head> 
    ... 
    <meta content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;' name='viewport' /> 
    ... 
    </head> 
    <body> 
    ... 
    </body> 
</html>

も参照してください： CSS Media Query Orientation Change not working PhoneGap

出典

2012-03-13 13:58:46

PhoneGapの使用中にcssメディアクエリが機能しない

答えて

関連する問題