1

我们有一些非标准的网络字体（我们有许可证），我们收到了该字体的 .otf 版本。有一些在线工具可以将字体转换为 web 格式，然后使用一些 css 可以包含字体，到目前为止一切都很好。

然而，当在不同的浏览器中显示文本时，呈现的文本更宽/更小，字间距也不同。我进行了测试以确保字体在不同的浏览器中实际使用，并且一切正常。

支持所有浏览器需要 4 个字体文件，而且似乎每个文件对于使用的每种字体大小都有自己继承的字母间距和字间距。

如果你想在这里看到包含语句，它是：

@font-face {
    font-family: 'myfont';
    src: url('myfont.eot?') format('eot'), 
         url('myfont.woff') format('woff'), 
         url('myfont.ttf')  format('truetype'),
         url('myfont.svg#webfontaAipHhrc') format('svg');
    }

我认为处理这个问题的最好方法是生成具有相同单词和字母间距的不同格式的字体，只是我不知道如何实现这一点。

字体内部使用 EM 作为字形宽度。因此，将文档字体大小设置为某个值并对使用的字体进行相应缩放，然后为我使用该字体的每个元素设置一个字体大小对我来说是有意义的。

在@font-face 定义中设置字母和单词间距也没有任何效果，因为它是设置字体自身间距的调整。

任何人都知道一个字体生成器，它对每个生成的字体都有相同的单词和字母间距？还是有其他解决方案/建议？

我尝试了 2 个字体生成器，但只记得最后一个，http://www.fontsquirrel.com/fontface/generator

同样，在使用该字体时，任何人都知道如何测试是否可以在给定字体的情况下打印所有语言（utf-8 字符）？我尝试打印一堆 utf-8 字符以查看它们是否可以显示，但我当然不知道所有语言，所以我不知道它是否可以。

谢谢 ：）

编辑：

我制作了我使用的不同浏览器如何呈现字体的打印屏幕

http://www.imagedump.nl/img9/8589/15fonts.png

使用的 css：

.test {
    font-family: myfont;
    font-size: 20px;
    letter-spacing: -0.67px;
    word-spacing: 1px;
}

我正在寻找的东西是有一些默认的起始位置，所有浏览器都呈现相同的字体

与“不同”部分相比，像 ff 这样的浏览器呈现的文本与像 ie 这样的浏览器不同，它们都使用不同的生成字体文件。但是当它们都使用相同的生成字体文件（woff）时，chrome 与 ff 也存在差异

4

2 回答 2

1

There isn't enough detail in your question to understand the issue. The browsers do use the font's internal spacing. It is not 'different' depending on where it is shown.

That said, the hinting applied to a font can influence its display on Window's browsers as it tries to fit the font outlines into the pixel grid. By doing this, the whole font can grow/shrink horizontally as it tries to fit in the grid. I have seen that.

Could this account for what you are seeing? Otherwise I'd like to see side-by-side screenshots so I can understand what it is you are talking about.

于 2011-03-12T13:41:09.920 回答
0

To solve this it would be, in my mind, appropriate to simply use some browser specific instructions on how to render the font. I am not proficient enough to know the CSS for a browser specific styling on the p and h tags which would work in this instance.

于 2011-03-18T14:09:00.707 回答