1

私はモバイルWebページを作成していて、さまざまな画面サイズを処理するのに苦労しています。基本的に、ページをブラウザーではなく実際の画面の幅にしたいのです。

モバイルブラウザの動作方法により、次のメタタグが設定されている場合、ほとんどのブラウザのデフォルトの「幅」は320ピクセルです。

<meta name="viewport" content="width=device-width, initial-scale=1"></meta>

ページがブラウザの「解像度」ではなく、画面のフル解像度になるようにするにはどうすればよいですか?

いくつかの簡単な解決策が必要です。

注:初期スケールフラグを2に設定すると、iPhoneとAndroid携帯の両方でページが320ピクセルより小さくなり(それぞれ幅640ピクセルと480ピクセル)、0.5に設定すると、両方のデバイスでページ幅が640ピクセルになりますが、ズームインしますAndroidデバイスで。それはiphoneに望ましい効果を与えました。

私のページ:mmhudson.com/index1.html

4

2 に答える 2

2

そのリストから欠落しているプロパティはですtarget-densitydpi=device-dpi

http://developer.android.com/reference/android/webkit/WebView.html

デフォルトでは、WebViewは、中密度画面のデフォルトの外観に一致するサイズで描画されるようにWebページを拡大縮小します。したがって、高密度画面では1.5倍のスケーリング(ピクセルが小さいため)を適用し、低密度画面では0.75倍のスケーリング(ピクセルが大きいため)を適用します。

device-dpi-デバイスのネイティブdpiをターゲットdpiとして使用します。デフォルトのスケーリングは発生しません。

于 2013-02-05T20:58:24.930 に答える
0

maximum-scaleを追加し、densitydpiを次のように追加してみましたか?

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, target-densitydpi=device-dpi">

ここに、モバイルブラウザの良い例があります。

https://developer.mozilla.org/en-US/docs/Mobile/Viewport_meta_tag

しかし多分それはブラウザに依存します。

于 2013-02-05T20:14:32.123 に答える