我正在使用phonegap和jQuery mobile开发Android应用程序。在浏览器中，页面看起来很好，但是当我在设备上运行应用程序时（=在webview中），这些页面看起来便宜而且有点......关闭。几乎就像页面缩放101％或类似的东西。有没有其他人遇到这个问题？知道怎么解决吗？
答案 0 :(得分：5)
您是否尝试将target-densitydpi=device-dpi值添加到页面的</head>中的viewport元标记，如下所示：
<head>
<meta name="viewport" content="width=device-width, target-densitydpi=device-dpi" />
...
</head>
应该这样做;我希望它有所帮助！
答案 1 :(得分：2)
实际上，没有任何字体大小副作用的实际修复方法正在解决这个问题 CSS Text-shadow如下。
* {
text-shadow:0 0 0 transparent;
text-shadow:none;
}
这可确保您的字体没有阴影，这就是文本看起来模糊的原因。如果你仔细观察，你可以看到文字实际上并不模糊，但有相同颜色的阴影。
答案 2 :(得分：1)
还在jQuery forum上建议将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">
这个fixit对我有用。虽然jQuery论坛帖子也建议最后的工作可能包括一些Android特定的css：
- if is_android?
%link{:rel => 'stylesheet', :type => 'text/css', :href => '/stylesheets/mobile/android.css'}/
答案 3 :(得分：0)
在移动设备上测试时也遇到同样的问题。但请参阅此link：
CSS“px”单元可能与设备的实际像素不同，如 浏览器将图像和字体“缩放”到比您请求的更大的尺寸。 （浏览器很自然地假设你并不是真的意味着“像素” 当你说“px”时，并有助于调整你的内容的大小 它在高分辨率手机屏幕上可读。）
然后，我将TARGET-DENSITYDPI更改为“target-densitydpi = 150”并且它正常工作（在NEXUS 10上测试）。
答案 4 :(得分：0)
尝试将空白字符“”放在图像的同一容器中，我不确切知道但它对我有用。
答案 5 :(得分：0)
Webkit使用“css像素”，然后将其重新计算为物理设备分辨率 - 这可能就是问题所在。
如果你有一个典型的4＆＃34;手机屏幕为480x800，css像素为320x533，CSS像素比为1.5。
在这种情况下，32 x 32px图像需要至少48 x 48px才能看起来很好而且清晰。因为有些设备的像素比率为2（iPhone 4/5），所以我通常使用2倍大图像，它们看起来非常好，几乎和svg图像一样好（并且老版浏览器的宽度没有问题）。
这样做，您需要记住定义图像大小
background:url('myimage64.png'); background-size:32px 32px;
或
<img src='myimage64.png' width='32' height='32'>