字体在 Firefox 中看起来更糟：为什么以及如何为 Firefox 编写 hack？答案

【问题标题】：Font looks really worse in Firefox: why and how I can write a hack for Firefox?字体在 Firefox 中看起来更糟：为什么以及如何为 Firefox 编写 hack？
【发布时间】：2013-08-15 22:16:38
【问题描述】：

这是一个例子：

首先 - 它在 Chrome 中的外观，其次 - 在 Firefox 中（难以阅读）。

CSS：

 font-family: Arial,Liberation Sans,DejaVu Sans,sans-serif;
    font-size: 13px;

您能否提供一个示例，如果浏览器是 Firefox，我如何才能使该元素的字体变为粗体？

【问题讨论】：

因为 Firefox 在字体渲染方面很烂。还有一堆其他的东西。更准确地说，IE 和 Chrome 使用先进的字体渲染技术使文本更易于阅读——这主要与操作系统有关。 Firefox 推出了自己的字体渲染器，但没有。
更多信息请参见this Coding Horror article。
@Kolink，这真的很糟糕。我该怎么办？
很遗憾，您无能为力。自第 4 版以来，Firefox 一直让我感到沮丧，因为它一直很糟糕>_>
这可能根本不会影响您的字体渲染，但应该引用其中包含空格的字体名称。 ——就个人而言，我认为字体在 Firefox 中比在 Chrome 中看起来更好。 Chrome 中的字体没有清晰的别名。

标签： css firefox fonts

【解决方案1】：

当我测试 13px Arial 时，它在 Chrome 中看起来比在 Firefox 中更轻，而不是像你的情况相反。在字体渲染方面，请继续关注浏览器版本、平台和设置的变化。

可以在 JavaScript 中使用通常的browser detection 技术来检查浏览器是否声称是 Firefox 并相应地修改 CSS 代码。但这将是在黑暗中拍摄，部分原因是提到的变化，部分原因是您实际上无法解决假设的问题。粗体往往会改变文本的整体外观，而不仅仅是稍微加粗笔画，而且粗体常常降低可读性。

避免产生此类问题的方法：不要将字体大小设置为小至 13 像素。特别是对于小字体，在白色（或其他非常明亮的）背景上使用黑色（或非常暗的东西），而不是相反，尤其要避免使颜色对比度过小。

【讨论】：

【解决方案2】：

似乎 firefox 在 css 中只能使用 2 个背景 url...如果它有第 3 个字体，那么字体会产生模糊/像素化的效果。从来没有……我发现它在 Windows XP 上是真的。 Windows 8 上的相同 Firefox 工作正常。（我很惊讶）我可能认为这与 forefox 中的“使用硬件如果可用”选项有关。

尝试从表格的 CSS 中删除背景“图像”或“颜色”……如果解决了，那么……firefox 很烂。

【讨论】：