一些字体大小在 Safari (iPhone)上呈现得更大

是否存在 CSS 或其他原因导致 Safari/iPhone 会忽略某些字体大小设置？在我的个人网站上，iPhone 上的 Safari 渲染了一些字体大小: 13px 的文本，比字体大小: 15px 的文本大。它是否可能不支持某些元素的字体大小？

80115 次浏览

小开

最佳答案

Joe 的回复中有一些很好的最佳实践，但我认为您描述的问题主要围绕这样一个事实: 如果 Mobile Safari 认为文本渲染得太小，它会自动缩放文本。您可以使用 CSS 属性 -webkit-text-size-adjust来解决这个问题。这里有一个如何在你的身体上应用这个的例子，只是为了 iPhone:

@media screen and (max-device-width: 480px){
body{
-webkit-text-size-adjust: none;
}
}

小开

我也遇到了同样的问题，原来在 CSS 中有这样一行:

- webkit-文本大小-调整: 120% ;

我不得不改成100% 一切都很顺利。不需要将所有 px 更改为 em 或%% 。

小开

Also, make sure you are setting the initial zoom setting to 1 in your viewport meta tag:

<meta name="viewport" content="width=device-width; initial-scale=1.0;" />

小开

使用100% 代替无。

Css 包括这个

小开

还要检查你是否没有设置你正在操作的元素的宽度/高度，Safari 在 svg 中给出了大小优先于字体大小的设置，Chrome 和 FF 似乎至少目前没有。