4

phonegap と jQuery mobile を使用して Android アプリケーションを開発しています。ブラウザーでは、ページは問題なく表示されますが、アプリをデバイスで (= Web ビューで) 実行すると、ページが安っぽく見えます。ページが 101% にズームされているかのようです。他の誰かがこの問題に遭遇しましたか? それを修正する方法はありますか？

4

6 に答える 6

5

次のように、ページtarget-densitydpi=device-dpiのビューポート メタ タグに値を追加してみましたか。</head>

<head>    
    <meta name="viewport" content="width=device-width, target-densitydpi=device-dpi" />
    ...
</head>

これでうまくいくはずです。それが役立つことを願っています！

于 2012-06-04T20:35:44.147 に答える
2

実際、フォントサイズの副作用のない本当の修正は、次のように CSS Text-shadow に対処しています。

* {
text-shadow:0 0 0 transparent;
text-shadow:none;
}

これにより、フォントにドロップ シャドウがなくなり、テキストがぼやけて見えます。よく見ると、テキストが実際にぼやけているのではなく、同じ色のドロップ シャドウがあることがわかります。

于 2014-03-09T21:20:13.447 に答える
1

jQuery フォーラムuser-scalable=0でも、増え続けるメタ タグに追加することが提案されました。したがって、最終的には次のようになります。

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, target-densitydpi=device-dpi, user-scalable=0">

この修正は私にとってはうまくいきました。jQuery フォーラムの投稿でも、最終的な回避策として Android 固有の CSS を含めることが提案されています。

- if is_android?
  %link{:rel => 'stylesheet', :type => 'text/css', :href => '/stylesheets/mobile/android.css'}/
于 2013-02-04T19:59:07.323 に答える
0

画像の同じコントレーナーに空白文字 " " を入れてみてください。正確にはわかりませんが、うまくいきます。

于 2014-01-06T09:50:42.757 に答える
0

モバイルデバイスでテストするときにも同じ問題があります。ただし、このリンクを参照してください。

CSS の "px" 単位は、デバイスの実際のピクセルとは異なる場合があります。これは、ブラウザーがイメージとフォントを要求したサイズよりも大きく "スケーリング" するためです。(ブラウザーは、ユーザーが「px」と言ったときに、実際には「ピクセル」を意味するものではないと自然に想定し、コンテンツのサイズを変更して、高解像度の携帯電話の画面で読みやすいようにします。)

次に、TARGET-DENSITYDPI を「target-densitydpi=150」に変更すると、正常に動作します (NEXUS 10 でテスト済み)。

于 2013-02-15T03:22:17.443 に答える