Google字体无法在Google Chrome上呈现

我正在建立一个新的WordPress主题(不知道是否相关),并且这个问题一直困扰着我。


我已经从Google Webfonts(包括CSS <head>部分)中加载了Roboto Slab 。在其他所有浏览器上,除了Google Chrome之外,字体都可以正常显示。当我第一次在Google Chrome浏览器中加载网站时,使用该自定义字体的文本根本不会显示(即使字体库将佐治亚州作为后备- "Roboto Slab", Georgia, serif;)。将鼠标悬停在样式链接上或在Inspector中重新触发任何CSS属性后,文本将变为可见。


自从我在一段时间前启动主题以来,我可以清楚地记得它以前运行得很好。这是一些已知的最近的Chrome更新错误吗?


首次加载: 屏幕截图#1


重新应用任何CSS属性后,进入响应视图或将元素悬停: 屏幕快照#2


有人有类似的问题吗?我应该如何进行呢?


谢谢!




温温酱
浏览 389回答 3
3回答

慕哥9229398

显然,这是一个已知的Chrome错误。有一个仅css的解决方法可以解决此问题:body {&nbsp; &nbsp; -webkit-animation-delay: 0.1s;&nbsp; &nbsp; -webkit-animation-name: fontfix;&nbsp; &nbsp; -webkit-animation-duration: 0.1s;&nbsp; &nbsp; -webkit-animation-iteration-count: 1;&nbsp; &nbsp; -webkit-animation-timing-function: linear;}@-webkit-keyframes fontfix {&nbsp; &nbsp; from { opacity: 1; }&nbsp; &nbsp; to&nbsp; &nbsp;{ opacity: 1; }}似乎只需要告诉Chrome重新粉刷文字

UYOU

CSS修复对我不起作用,而且0.5秒的延迟脚本似乎很尴尬。这个JS片段似乎对我们有用:<script type="text/javascript">jQuery(function($) {&nbsp; &nbsp; if (/chrom(e|ium)/.test(navigator.userAgent.toLowerCase())) {&nbsp; &nbsp; &nbsp; &nbsp; $('body').css('opacity', '1.0')&nbsp;&nbsp; &nbsp; }})</script>
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

Html5