Android上的Chrome调整字体大小

显然，一段文本达到一定长度后，android上的chrome会决定调整文本大小并使其变大（导致各种各样的乐趣）。现在我有一个网站，其中大约一半的p-tag符合我设定的尺寸，另一半则随意改变 - 显然取决于段落的长度。Android上的Chrome调整字体大小

我究竟如何解决这个问题？

来源

2012-07-02 Sprax

你有一个例子吗？另外，哪款Android和Chrome版本？ – Junuxx

这被称为“字体提升”，在WebKit bug中有详细描述。目前无法禁用它。

来源

2012-07-06 05:53:20

我找到了我的页面的解决方案：给父元素一个宽度和高度！字体不会超出这些边界，所以它会保持很小（呃）。

来源

2012-07-12 08:07:06

将max-height: 999999px;添加到要防止字体提升的元素或其父项。

来源

2012-10-18 23:14:35 moeffju

它的作品...怎么回事！ – Laurent

+12

Android Chrome仅将字体提升应用于具有动态高度的元素。只要您指定高度或最大高度，则不会应用字体提升。将最大高度设置为大数很简单，应该没有副作用。 – moeffju

只是一个警告。这解决了我在Android上使用Chrome字体时遇到的问题，并不是很好。 **然而**它打破了特定版本的iOS网站的ipad视图。 –

包括文档<head>在以下<meta>标签：

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

这将正确地建立视图帧，并且因此消除了对“FontBoosting”的需要。

来源

2013-01-03 01:29:50

这绝对是首选的解决方案。如果您关心移动设备的外观，那么请考虑您的视口的所有权！ –

虽然这不会禁用字体提升。 –

它肯定会纠正不必要的缩放，我将来会使用它。 – Dizzley

经过一些测试后，这个规则帮了我一个忙。必须添加到包含提升文本的元素或其父项，具体取决于div/table结构。

element or parent element { 
    /* prevent font boosting on mobile devices */ 
    width: 100%; 
    height: auto; 
    min-height: 1px; 
    max-height: 999999px; 
}

也许宽度和heigth值必须进行修正，根据您的需求。

来源

2013-03-22 18:50:52 metamagicson

将其置于您的重置状态。 html * {max-height:1000000px;}

来源

2013-11-06 21:58:02

对我造成粘滞页脚的问题，不得不做html身体*而不是 –

现在有您可以设置来控制这个CSS属性：

-webkit-text-size-adjust: none; 
-moz-text-size-adjust: none; 
-ms-text-size-adjust: none;

见https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust

来源

2017-02-01 15:48:38 Gareth

text-size-adjust：没有为我最新的android chrome工作。 –

Android上的Chrome调整字体大小

回答

相关问题