与字体大小或字体编码有关的字体定位错误

Question

当我指定line height:1 UNTIL字体大小超过255px时，我遇到了一个问题，其中字形定位正如我所期望的那样。将字体大小设置为256和bam，字形会显着改变位置，并且在行上变得太高。

我正在使用Google网络字体引入Josefin Sans - http://www.google.com/webfonts/specimen/Josefin+Sans

编辑：我在Fedora上使用Chrome，而不是那些拥有市场份额和资金的酷机器

简化小提琴 - http://jsfiddle.net/jBAnc/

编辑：小提琴没有为我显示代码。如果你点击“培根”，它将在255和256之间切换，导致它来回反弹（至少对我而言）。

当字体是基本的Web安全字体（如Arial）时，我没有遇到此问题，因此我认为它与google Web字体有关。这是字体编码的问题，可能是创建字体的程序（255似乎很重要）？

Answer 1

我的字体高度/间距问题不一致。我开始怀疑这是Josefin Sans本身建设的一个问题。

编辑：经过多次Googlizing后，问题似乎不是字体本身，而是Google Webfont API。

http://webdesignandsuch.com/fix-fonts-that-dont-work-with-google-font-api-in-internet-explorer-or-chrome-with-font-face/

简短回答：自己下载并托管字体，你应该没有问题。

Answer 2

根本没有错。您只是希望所有字体具有相同的x高度，下降/扩展器高度，而它们不会（10次中的9次）。

以下小提琴演示了4种字体之间的差异（3种是Mac，PC等上常见的字体）。 Josefin Sans也在家里。

特别注意以下方面的差异：

• 大写Q与其父级边界之间的顶部间距
• Xx的各种高度（特别是小写与资本）
• 小写G的下降（有些实际上是从他们的 亲本）

_http：//jsfiddle.net/suK2U/

要回答你关于255 / 256px的问题，我冒昧地说你刚刚发生在你的容器和它的父母之间的“甜蜜点”。在256处，它开始碰撞（并且边距开始崩溃等）。