好的,所以有问题的网站是这样的：
现在,如果您在本网站上发现,白色背景div的分辨率为446px,横跨y 686px长.它也是流动的,所以如果你收缩它,它会显得不同,以适应不同的尺寸. (如果你的手机宽度小于400px,它实际上会显示不同的图像).
好的,但关键在于此页面未在Android设备上显示,如下所示.
该手机以及该预览器中480px x 800px的所有其他手机都在显示这样的网站.如果您点击它,您可以看到该网站的最大高度为686px,那么为什么这个移动设备上显示的整个页面都没有？
这个“playplanet”徽标的大小实际上是180px横跨它几乎填满了整个宽度,并且该手机的宽度被支持为480px横跨.
我在这里错过了什么吗？
<Meta name="HandheldFriendly" content="true" /> <Meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
这些应该告诉Android浏览器将页面显示为设备的实际宽度,所以应该告诉它将其显示为480px X 800px(三星galaxy s 2是480px X 800px),但实际上如果你看一下屏幕截图,实际上它显示为HALF那个尺寸,因为徽标只有180px而且它几乎填满了整个屏幕.
它应该完美地适合那里.有趣的是,我的小于400px的宽度布局完美适用于较小的功能手机尺寸(240 x 320或反之亦然),但这个更大的一个导致我的问题.
解决方法
你试过target-densityDpi = device-dpi吗？
引自this article：Android团队已实现自定义元视口属性,允许您自定义高分辨率(HDPI)屏幕的浏览器缩放. CSS“px”单元可能与设备的实际像素不同,因为浏览器将图像和字体“缩放”到比您请求的更大的尺寸.更糟糕的是,它使用非整数缩放因子(例如1.5倍缩放,缩放320px到480px),这使得图像看起来非常奇怪.
此外,在此introduction to meta viewport中,“设置目标密度”部分下面的示例与您的情况类似.
这是更新的元数据：
<Meta name="viewport" content="width=device-width,user-scalable=no,target-densityDpi=device-dpi">
