Question

我在我的网站的CSS文件中有以下内容：

body {
font-family: Georgia, "Times New Roman", serif;
font-size: 1.125em;
line-height: 1.5em;
}

在Mac上的Safari中，网站的字体看起来就像我想要的那样：

但是，在IE和Chrome中的Windows计算机上，字体看起来不像上面那样，请参阅：

我的问题是，如何在所有操作系统上的所有浏览器中看到相同的字体，如上面的屏幕截图＃1？

提前感谢您的帮助。

Answer 1

这是一个非常平滑的问题，不同于浏览器，它们不会以相同的方式“读取”字体。

以下文章解释了该过程Font smoothing explained。

这是一个CSS hack，你可以尝试，以便在任何地方得到相同的结果：

html, html a {
    -webkit-font-smoothing: antialiased;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
}

Answer 2

您无法对此做任何事情，但您可以测试您使用的字体的变体，并可能重新考虑您的字体选择。有些字体受差异影响比其他字体更多。

在不同的平台上，在某种程度上，在不同的浏览器中，字体的呈现方式也不同。参见例如A Closer Look At Font Rendering

渲染还可能取决于系统和/或浏览器设置。在普通文本上测试样式表时，我在Windows上看到的内容与屏幕截图非常不同。

Answer 3

Windows以其糟糕的字体平滑而闻名;一个确定的，跨浏览器的替代方案是用.png图像替换你的整个内容（因为.jpg往往对文本很糟糕）。当然，这不是一个可行的替代方案，因此在所有浏览器都支持font-smoothing属性之前（如上所示），您将陷入当前状态。