Google webfonts 在页面加载时呈现不可见答案

【问题标题】：Google webfonts render invisible on page-loadGoogle webfonts 在页面加载时呈现不可见
【发布时间】：2013-06-20 08:41:33
【问题描述】：

我对此感到很困惑，不知道如何展示一个例子。

在我的网站上使用 Bootstrap。加载 Google Web-Font，就像我过去做过多次一样，从来没有遇到过问题。

由于某种原因，H1 和 H2 在我用鼠标突出显示它们之前是不可见的，或者一直滚动到页面底部然后再返回。有时在页面加载时，我可以看到字体的一点点，比如几个字母的底部等。

或者，如果我打开检查面板并切换与字体相关的任何内容...例如大小、颜色等。它们会显示出来。

这只发生在 Chrome 中。

有什么建议吗？以前从未见过。

【问题讨论】：

productforums.google.com/forum/#!topic/chrome/h9qULzjXKVw 和 code.google.com/p/chromium/issues/detail?id=137692 可能会对您有所帮助。
谢谢@Ravimalya。除非我错过了什么，否则这似乎是一个略有不同的问题。这些问题似乎与替代谷歌网络字体的默认字体有关，而我的根本没有出现......或者如果它们确实出现了，它是字体底部的零碎碎片......非常令人困惑.
我们可以提供一个页面的实例吗？所以我们可以进一步检查。
对此是否有更多了解？我有同样的问题。

【解决方案1】：

我也遇到这种情况。一旦页面完成加载，我就能够通过使用 JavaScript 更改受影响元素上的任何 CSS 属性来“修复故障”。

一个使用 jQuery 的例子：

$(window).on('load', function() { $('h1,h2,h3,h4,h5,h6').css('zoom',1); });

【讨论】：

【解决方案2】：

我的回答更像是“不明白但很高兴我弄明白了”的情况。我遇到问题的内容区域之前的内容窗格在某些链接中使用了网络字体。我将这些链接的字体大小设置为 18px。将字体大小更改为 21px 或 14px，以及其他几个大小解决了这个问题。

我不明白为什么...也许网络字体与 18px 大小不兼容？然而我从来没有遇到过这个......它是零意义的。也许有人仍然可以对这个主题有所了解。

【讨论】：