字体显示在铬/火狐不同(fonts are displaying different in chro

每一个人。

我在不同的浏览器中显示我的网页获得的问题。这里我使用“Myrid集临”字型。

我在Chrome得到正确。但不能在Firefox。我附上这些文件。

这里第一个是预览在Chrome中。而第二个是预览在Firefox。

我试过文本渲染也。但是，没有使用

text-rendering: optimizelegibility;

Answer 1:

目前，关于这一主题没有达成共识。可耻的是，有很多技巧的，但此问题没有具体的解决方案。

问题是，每一个浏览器和执行系统不同的方式处理字体渲染。这就是为什么如此难以跨越的网络浏览器和系统，以获得相同的结果。

这个同样的问题已经被问了几个在这里倍SO：

1 .- 我如何获得字体在所有浏览器中正确显示？

2：但相同的字体它的重量似乎在不同的浏览器不同

下面，我将列出一些建议的解决方案; 但它是可能的，他们将无法正常工作：

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

// @oneiota
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;

而且还有另外一个使用translate3d： web字体渲染，fix.css

body {
  -webkit-transform: translate3d(0px, 0px, 0px);  /* Force hardware acceleration to fix safari opacity bugg*/ 
}

我的建议，寻找网络安全字体http://cssfontstack.com/这将减少字体渲染的跨Web浏览器和手术系统的影响。

Answer 2:

我已经在过去同样的问题。看看这篇文章对跨浏览器的字体面孔 - 希望这可以帮助您解决问题。

http://alistapart.com/article/say-no-to-faux-bold

用新信息更新：

我发现了一个更简单的方法来解决这个（就我而言，事实证明，这只是发生在Firefox的OSX） - 以下内容添加到您的基本排版css文件：

-moz-osx-font-smoothing: grayscale;

有这CSS-Tricks.com论坛讨论的更多信息： https://css-tricks.com/forums/topic/typekit-fonts-much-bolder-in-firefox/page/3/

虽然论坛讨论主题特别提到Typekit字体，精美的解决方案应用到谷歌的字体。

文章来源: fonts are displaying different in chrome / firefox