相同的字体文件、相同的 PC、相同的操作系统、相同的浏览器、相同的代码——两个不同站点上的两种不同渲染结果。是什么赋予了？答案

【问题标题】：Same font files, same PC, same OS, same browser, same code--two different rendering results on two different sites. What gives?相同的字体文件、相同的 PC、相同的操作系统、相同的浏览器、相同的代码——两个不同站点上的两种不同渲染结果。是什么赋予了？
【发布时间】：2013-08-08 07:33:23
【问题描述】：

我在雇主的网站上遇到了一个令人难以置信的令人沮丧的问题。（此处截图：http://imgur.com/Pvb5lrl）

我已经添加了所有字体文件，并且尽我所能正确地编写了代码。但是，文本在 Chrome 和 Firefox 中呈现出令人难以置信的锯齿状和丑陋。奇怪的是，我使用相同的字体文件、相同的@font-face 代码和文本本身的相同 CSS 设置的一个简单测试在同一台机器上的相同浏览器中渲染得很好。知道什么可能导致整个网站上的糟糕渲染吗？两者的网址都在下面供参考。

公司网址：http://staging.lmsonline.com/services/email-marketing/

简单测试：http://datafulfill.com/fonttest/demo.html

屏幕截图（Windows 7、Chrome）：http://imgur.com/Pvb5lrl

【问题讨论】：

会不会和字体粗细有关？（演示中为 300，原始站点中为 400）
不错，但没有。我只是尝试将其更改为 300，但仍然没有运气。

标签： html css webfonts

【解决方案1】：

不确定，您的字体应该是什么样子。在我的最后，它有点像 Arial，无论如何它与通用的无衬线字体几乎相同。过去玩弄字体教会我按以下顺序解决问题：

@font-face {
font-family:"Delitsch Antiqua";
src:url("/path/to/fonts/DelitschAntiqua.eot");
}
@font-face {
font-family:"Delitsch Antiqua";
src:url("/path/to/fonts/DelitschAntiqua.ttf");
}

首先服务 IE，然后是其余的。由于某种原因，它从来没有完全相反。

【讨论】：