@font-face 为不同的文件显示不同的字母间距

Question

我们有一些非标准的网络字体（我们有许可证），我们收到了 该字体的 .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 也存在差异

Answer 1

在我看来，为了解决这个问题，简单地使用一些浏览器特定的指令来渲染字体是合适的。我不够精通，无法了解在这种情况下可以使用的 p 和 h 标签上的浏览器特定样式的 CSS。

Answer 2

您的问题中没有足够的细节来理解问题。浏览器确实使用字体的内部间距。它不会因显示位置而“不同”。

也就是说，应用于字体的提示会影响其在 Window 浏览器上的显示，因为它会尝试使字体轮廓适合像素网格。通过这样做，整个字体可以在尝试适应网格时水平增长/缩小。我已经看到了。

这可以解释您所看到的吗？否则，我希望看到并排的屏幕截图，以便了解您在说什么。