7

我们的客户请求了一个网站,但不想为移动版本付费。我们仍在使其在移动设备上运行。当一直缩小时,Android (4.0) 上的 Chrome 正在缩放一堆文本。我们尝试设置 -webkit-text-size-adjust:none 属性,但它似乎被忽略并且文本仍在按比例放大。

在 iOS 上运行良好。

有什么建议么?

4

5 回答 5

32

刚刚发现了一个解决方法。将文本的父元素的最大高度设置为比它出现的要大得多。例如,

<p class="intro">
  This is some text that is appearing blown up 
  and ridiculous on Chrome Mobile.
</p>

p.intro {
  max-height: 5000em;
}

您可以在任何父元素上设置最大高度。它不一定是第一个父母。例如,

<footer class="primary">
  <p class="intro">
    This is some text that is appearing blown up 
    and ridiculous on Chrome Mobile.
  </p>
</footer>

footer.primary {
  max-height: 5000em;
}
于 2013-02-28T14:10:03.930 回答
7

请注意,-webkit-text-size-adjust您提到的属性是非标准的。在此处阅读更多相关信息。

目前,Android 版 Chrome 使用字体增强来缩放文本,并且无法禁用它。

如果您想要一种禁用字体增强的方法,请提供您的用例并通过new.mcrbug.com记录问题。

于 2012-07-29T23:13:46.680 回答
6

<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=yes"><head>标签中可以禁用缩放

于 2014-09-02T08:20:13.787 回答
4

我在 Android 上使用 Firefox 时遇到了同样的问题。

我的解决方案是添加样式“float:left;” 到包含问题文本的 div。

您可能需要将 div 的宽度设置为与父级相同(以像素为单位或 100%),以确保它不会影响其余 div。

请参阅如何防止移动浏览器调整文本大小

于 2013-11-07T00:48:10.963 回答
3

-webkit-text-size-adjust:none太可怕了!

我的眼睛网站很差,而且我的页面经常以 200% 的默认缩放比例显示。使用-webkit-text-size-adjust:none,我无法阅读任何内容,我唯一的选择是使用 Firefox。这是我这些天浏览时的头号问题。

太多的网站使用它,尤其是网页上嵌入的 Facebook 评论。您应该停止使用它并创建一个可以使用任何大小字体的界面。

于 2012-09-20T17:21:23.700 回答