Google 字体无法在 Chrome 中呈现？快速修复 CSS

Google Chrome 上的 Google Webfonts 渲染问题

您并不孤单！许多人都遇到过 Google Fonts 无法在 Google Chrome 上呈现的问题。即使包含了必要的 CSS，这个看似最近的问题仍然会出现。令人沮丧的是，尽管有像 Georgia 这样的后备字体，但自定义字体最初未能显示。

Chrome 更新错误？

看来这确实是一个已知的 Chrome 错误，让全球的网络开发者感到沮丧。一种仅 CSS 的解决方法可以提供快速修复，而不是永久性的挫折。

CSS 解决方法

要纠正该问题，只需添加以下代码片段到您的样式表：

body {
    -webkit-animation-delay: 0.1s;
    -webkit-animation-name: fontfix;
    -webkit-animation-duration: 0.1s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
}

@-webkit-keyframes fontfix {
    from { opacity: 1; }
    to   { opacity: 1; }
}

此解决方法本质上会提示 Chrome 重新绘制文本，从而解决渲染问题

结论

虽然根本原因可能仍然是个谜，但这种纯 CSS 解决方案提供了一种简单而有效的方法来克服 Google Fonts 渲染问题谷歌浏览器。将这些片段合并到您的样式表中，您将发现您的自定义字体再次为屏幕增光添彩！

以上是Google 字体无法在 Chrome 中呈现？快速修复 CSS的详细内容。更多信息请关注PHP中文网其他相关文章！