我的字体在Chrome浏览器中有所不同

Question

我有一个网站，这是一个互联网论坛，在我的论坛帖子中，我有以下字体：

font-family: 'Segoe UI',Tahoma,Arial,Helvetica,sans-serif;

现在，这是它在不同浏览器中的样子:(左起：chrome，firefox，IE）

如您所见，chrome显示的字体与其他两种字体完全不同。为什么？我该如何解决这个问题（我希望这个字体看起来像另外两个）？此外，这是我截取的页面的链接：https://scyk.pl/Forums/Thread/Na%20luzie/8（查看帖子内容）

Answer 1

正在发生的事情是Google Chrome很可能没有这种字体，而是使用后备字体。为确保不会发生这种情况，您可以使用

显式加载字体

  

@字体面

CSS3中的

，允许您通过引用显式加载字体。您可以了解有关使用@ font-face HERE的更多信息，使用src：并获取您使用的任何字体的url。

但是，如果字体不重要，我建议不要担心它，只是让Chrome使用后备字体。

要做@ font-face，代码为：

@font-face {
font-family:Segoe UI;
src:url(https://github.com/shawnphoffman/shawnphoffman.com/blob/master/Content/fonts/segoe-ui-semilight.woff);
}

您可能必须转到github链接并下载该字体的原始版本，然后在那里引用它。

Answer 2

你有几种选择，但我认为你会发现所有这些都不令人满意：

• 将页面渲染为服务器上的图像并将其发送给客户端。
• 获取Chrome的源代码，并将字体呈现引擎替换为Firefox使用的源代码。

哦，顺便说一句，它在Safari上看起来也会有所不同（可能与其他三种不同; Safari是一个非常复杂的浏览器，它会尽力使页面看起来很好;推动网页设计师在这个过程中疯狂是美的一个小代价; - ））。

渲染文字是您只能有限控制的内容。也许Chrome找不到Segoe UI，也许字体渲染引擎无法使用您的字体提示。虽然不理想，但我建议不要花太多时间。