Android 浏览器自动调整文本大小答案

【问题标题】：Android Browser resizes text automaticallyAndroid 浏览器自动调整文本大小
【发布时间】：2012-06-13 13:22:11
【问题描述】：

我有一个项目在 iPhone 上完美地显示 16px 文本字体为 0.5ems 链接。

但是，当我切换到 Android 浏览器时，文本字体会自行变大，并且我的链接位置被搞砸了。

我的链接在一个

<p><a>[Link]</a></p>

声明。

有什么方法可以防止 Android 文本自行调整大小？还是有更好的解决方案？

编辑：

我刚刚意识到安卓浏览器也不允许自动滚动。为什么会这样？ iPhone 和 Android 浏览器不是都以 webkits 为基础吗？即使使用相同的技术，为什么它们如此不同？我应该在 CSS 中声明任何额外的属性以使其与 Safari 对应项一样工作吗？

【问题讨论】：

我刚刚意识到安卓浏览器也不允许自动滚动。为什么会这样？ iPhone 和 Android 浏览器不是都以 webkits 为基础吗？即使使用相同的技术，为什么它们如此不同？我应该在 CSS 中声明任何额外的属性以使其与 Safari 对应项一样工作吗？
您能否同时显示 Android 和手机的打印屏幕以实际查看差异？ :)
嗯，我如何在 Android 中打印屏幕？
在我的安卓设备上，如果你按住电源按钮，它会为你提供打印屏幕的选项——（顺便说一句，我正在使用姜饼）
我实际上正在为此创建另一个媒体查询，它的最大设备宽度低于 480。这工作正常。也许是因为我的网站是一个内容较多的网站，因此在所有浏览器中缩放都是一个问题。

标签： android html css media-queries

【解决方案1】：

如果您想阻止 Android 自动缩放像素值，可以尝试将其添加到视口元数据中：

target-densitydpi=device-dpi

这是一个很好的参考：

http://designbycode.tumblr.com/post/1127120282/pixel-perfect-android-web-ui

【讨论】：

【解决方案2】：

我发现了一个可能有助于解决另一个问题的设置，Font size rendering inconsistencies on an iPhone：

body {
    -webkit-text-size-adjust: 100%;
}

另一个问题Font size issue with iPhone中描述了一个替代值：

html {
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
}

似乎其中之一可能会阻止 android 浏览器调整大小。希望这会有所帮助。

【讨论】：

【解决方案3】：

我也有类似的问题。我有一个专门为 Retina 显示屏设计的设计，但是 Retina 显示屏的像素密度实际上是 2，所以一个像素不一定是一个像素（非视网膜 iphone 像素宽度：320px，retina：640px）。

为了解决这个问题，我把它放在<head>:<meta name='viewport' content='width=device-width, initial-scale=.5, maximum-scale=.5'> 中，这样普通手机就会像我预期的那样缩放，而视网膜显示器也会适当地缩放（半比例）。

我不确定您使用的是哪种设计，但我会尝试使用初始比例和最大比例，尝试 0.5 和 1 看看你会得到什么。

【讨论】：

考虑到属性中的值，也许这并不奇怪，但这在 iOS 和 android 上都将我的视口减半，页面的左侧看起来相同，但右侧只是空白:)

【解决方案4】：

如果使用像素（px），则与屏幕像素密度有关。 iPhone“视网膜”显示屏显示的文本与您的 Android 设备不同。

这篇文章很好地涵盖了这个主题：http://kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/

【讨论】：

事情是，我的正文中只有那个 px 元素。我其余的 css 媒体查询都在 ems 中。那个单一的像素会影响其余的吗？我试过改变大小，但它仍然保持不变。
@RenoYeo 嗯。我在上面链接的那篇文章的附录建议使用百分比 (%) 作为正文元素的字体大小，而不是像素 (px)。这样做应该意味着无论屏幕大小如何，事情都可以很好地扩展。有帮助吗？
所以 100% 实际上是 16px，对吧？我要试试，然后告诉你进展如何
不，我的 iphone 文本也会自行调整大小。现在我有 iphone 和 android 的链接文本，它们的大小很大，会自动替换。