css – 相同的字体,但它的重量似乎不同的不同的浏览器

文字在Chrome中正确显示。我希望它在所有浏览器中以这种方式显示。我如何做到这一点？

铬：

UPDATE：在Safari中修复了-webkit-font-smoothing：antialiased;

Firefox：

这是CSS：

font-family: Georgia;
font-weight: normal;
font-size: 16pt;
color: #444444;
-webkit-font-smoothing: antialiased;

和一个小提琴：http://jsfiddle.net/jnxQ8/1/

解决方法

确保所有浏览器的字体都相同。如果是相同的字体，那么问题没有解决方案使用跨浏览器CSS。

因为每个浏览器都有自己的字体渲染引擎，他们都是不同的。它们也可能在以后的版本，或不同的操作系统不同。

更新：对于那些不了解浏览器和操作系统字体呈现差异的用户，read this和this。

然而，大多数人甚至没有注意到差别，用户也接受。忘记像素完美的跨浏览器设计，除非你：

>尝试通过CSS关闭子像素渲染(不是所有的浏览器都允许这样做，文本可能是丑陋的…)
>使用图像(资源要求很高，难以维护)
>更换Flash(需要一些编程，在iOS上无法使用)

更新：我检查了示例页面。通过文本呈现调整字距调整应该有助于：

text-rendering: optimizeLegibility;

更多参考：

>部分字体渲染由font-smoothing(如上所述)控制，另一部分为text-rendering.调整这些属性可能有助于在不同浏览器中其默认值不同。
>对于Chrome，如果这仍然没有显示为OK，请尝试这个text-shadow hack.它应该改善您的Chrome字体渲染，特别是在Windows。但是，在Windows XP下，文本阴影会疯了。小心。

原文地址：https://www.jb51.cc/css/222038.html