ios上的网络字体字母空间巨大

Posted 2023-02-23

【中文标题】ios上的网络字体字母空间巨大

【英文标题】：web font letter space huge on ios

【发布时间】：2018-07-17 21:59:03

【问题描述】：

ios 上的字体“DIN Condensed”字母间距很大（正好是之前的一个字母宽度）。这发生在所有 ios 设备上的所有浏览器（Safari 和 Google）上，带有原始 ttf，以及 font-squirrel 生成的 woff。

我该如何解决这个问题？

（到目前为止也尝试过 - 将字体文件重命名为 .otf）

这是网站：https://itstestlab.eu/

【问题讨论】：

可能字体是这样的？

不，它不是 - 在桌面和 android 上它显示正常间隔，添加了站点链接到问题。

【参考方案1】：

@font-facefont-family:'FontName';src:url('/f/f.woff2') format('woff2'),url('/f/f.woff') format('woff')

这是我最接近导入字体并且 Chrome、Firefox、IE10、Edge、Safari 回到版本 5 以上以及 iPhone 5S 和原始 iOS 以上没有问题。 它还解决了 Apple 对其他字体格式的 DRM（版权保护）问题。

我使用 FontSquirrel 将字体转换为其他格式，并将它们“标准化”，包括尺寸错误、定义错误的字形。有很多选项，但进行预定义的“通常”转换应该可以。

编辑：我查看了您的 CSS，发现 /cms/css/cms_normalise.scss 的最后一条规则将一些非标准内容应用于您的字体。它看起来像 reset.css 的过度使用。我不确定这是否会导致问题，因为我无法重现它，但您可能想检查一下..

【讨论】：

文本大小调整：100%； - 这是为了不让iphone把字体变大。有一些与此相关的奇怪错误，其中定义相同字体大小的文本显示不同，取决于 dom 中的位置。

【参考方案2】：

包含来自 Typekit CDN 的网络版本，它可以从那里工作。

似乎这是某种复制保护系统。发送给我的原始文件客户端仅供桌面使用。