1

我正在制作一个移动网页，并努力处理各种屏幕尺寸，基本上我想让我的页面成为实际屏幕的宽度，而不是浏览器的宽度。

由于移动浏览器的工作方式，当设置以下元标记时，大多数浏览器的默认“宽度”为 320 像素：

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

我该怎么做才能使页面成为屏幕的完整分辨率而不是浏览器的“分辨率”？

必须有一些简单的解决方案..

注意：将 initial-scale 标志设置为 2 使我的 iphone 和 android 手机上的页面小于 320 像素（分别为 640 和 480 像素宽）并将其设置为 .5 使两个设备上的页面宽度为 640 像素，但放大在安卓设备上。它在 iphone 上产生了预期的效果..

我的页面：mmhudson.com/index1.html

4

2 回答 2

2

您从该列表中缺少的属性是target-densitydpi=device-dpi.

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

默认情况下，WebView 会缩放网页，使其以与中等密度屏幕上的默认外观相匹配的大小绘制。因此，它在高密度屏幕上应用 1.5 倍缩放（因为它的像素更小）和在低密度屏幕上应用 0.75 倍缩放（因为它的像素更大）。

和

device-dpi - 使用设备的本机 dpi 作为目标 dpi。默认缩放永远不会发生。

于 2013-02-05T20:58:24.930 回答
0

您是否尝试添加最大比例并添加如下所示的 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 回答