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

Question

这是一个例子：

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

CSS：

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

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

在此处输入图像描述

score 0 · Accepted Answer

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

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

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

score 0 · Accepted Answer

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

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

2 回答 2