Windows（Firefox / Chrome）上的字体在任何浏览器中都会显示像素化

Question

我的应用程序存在问题，当我在Windows中测试时，字体会显得非常模糊和像素化。

我的字体系列非常简单：

body {  
  font-family: Helvetica, Arial, sans-serif;

以下是一个示例：

在我的开发框中，我没有任何问题（Ubuntu / Firefox / Chrome）。

我对CSS很新 - 这可能是操作系统吗？ Windows机器应该有Arial但不应该吗？

Answer 1

这是ClearType呈现字体的方式。这是完全正常的，所以我唯一的建议就是不要担心它或选择不同的字体。 Windows用户可能已经习惯了。

这是因为ClearType针对较小文本的读取进行了优化，但结果使得较大的文本看起来像在您的示例中一样像素化。如果你感兴趣的话，Here是一篇关于这个主题的更深入的文章。

事实上，如果你禁用ClearType，我敢打赌它会看起来好多了（虽然较小的文字看起来很糟糕）。

编辑：截至2013年9月，大多数浏览器（包括Firefox，Chrome和IE10，我相信）在Windows上使用自己的字体渲染引擎，因此这应该不再是问题。< / p>

Answer 2

许多Windows XP系统都关闭了字体平滑功能。我真的不知道为什么，但如果你打开显示器属性，你可以启用它。然后字体会显得更好。

当您使用像Arial这样的标准Windows字体时，问题并不是非常有吸引力，但如果您开始使用webfonts，它会变得非常难看。

可悲的是，您无法从浏览器中检测此设置或强制进行字体平滑

Answer 3

看起来正确渲染的默认窗口字体可能会尝试garamond或新罗马时代，但我认为一旦达到特定尺寸的窗口，你就会像这样运行像素化。

Answer 4

在Windows 10＆amp; Chrome组合我遇到了类似的问题，这就是为我解决的问题：

1. 从Windows选项启用CleanType文本。
2. 在chrome：// flags上禁用画布的2D加速。

Answer 5

我在我的网站上看到像素化的徽标也遇到了同样的问题。我曾尝试过.jpg和.gif文件。然后，我在Photoshop的“Save For Web and Devices”下拉菜单中保存了文件，现在它在网站上看起来很棒。