@ font-face用于远程字体的模糊/粗体/扭曲字形

Question

我试图切换到@font-face而不是依赖用户安装字体(确切地说它是Terminus字体,而不是它的TTF版本).

不幸的是,在处理远程托管文件时,我遇到了一些奇怪的"粗体"或"扭曲"字体,如下图所示:

正如您所看到的,由于某种原因,远程提取的字体在12,14,16,18,20,24种类型中被扭曲,因此本地字体对它们应用了某种"标准化",使它们看起来漂亮并且在 - 地点.

另外需要提一下的是,我试图使用FontSquirrel的WebFont Generator,其中demo-htmls屏幕截图分别显示在这些CSS代码中:

@font-face {
   font-family: 'terminus_ttfmedium';
   src: url('terminusmedium-4.38-webfont.ttf') format('truetype');
}

和

@font-face {
   font-family: 'terminus_ttfmedium';
   src: local('Terminus (TTF)');
}

Terminus(TTF)是刚刚安装到的同一包文件/usr/share/fonts/.

任何见解将不胜感激!

编辑:改变FontSquirrel高级选项似乎根本没有帮助这个问题.

编辑2:我没有试过在Firefox上尝试所有方法.另外,我已经将一个字体复制到一个工作目录(与本地使用的相同),通过"url"字段链接它仍然保持扭曲.这是徒劳的!

Answer 1

font-squirrel 曾经有一个具有多个输出的部分。TTF 不适用于所有版本的浏览器

     src: url('Bevan-webfont.eot?#iefix') format('embedded-opentype'),
     url('Bevan-webfont.woff') format('woff'),
     url('Bevan-webfont.ttf') format('truetype'),
     url('Bevan-webfont.svg#BevanRegular') format('svg');

他们曾经拥有带有所有这些扩展名的字体包，但似乎无法再在网站上找到它。