Question

我有一个基于Expression Engine构建的网站，虽然在Chrome浏览器和Safari中一切正常，但我在Internet Explorer和Firefox中遇到网页字体问题。问题是，当您第一次访问网站时，字体不会显示。如果你加载一个不同的页面，字体会显示，之后一切都很好。但是，如果清除浏览器的缓存并返回到网站，则会再次出现问题。

我尝试了从本地加载字体到确保字体样式直接加载到页面顶部的所有内容。

下面是我的CSS模板的前几行，它是在html文件的开头加载的，但是在＃34;标题中＃34;模板。有什么想法吗？提前感谢您提供的任何帮助！相关网站是：http://bayareafellowship.com

@font-face {
   font-family: 'montserratregular';
   src: url('fonts/montserrat-regular-webfont.eot');
   src: url('fonts/montserrat-regular-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/montserrat-regular-webfont.woff') format('woff'),
       url('fonts/montserrat-regular-webfont.ttf') format('truetype'),
       url('fonts/montserrat-regular-webfont.svg#montserratregular') format('svg');
   font-weight: normal;
   font-style: normal;

}

@font-face {
   font-family: 'leaguegothic-regular-webfont';
   src: url('fonts/leaguegothic-regular-webfont.eot');
   src: url('fonts/leaguegothic-regular-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/leaguegothic-regular-webfont.woff') format('woff'),
       url('fonts/leaguegothic-regular-webfont.ttf') format('truetype'),
       url('fonts/leaguegothic-regular-webfont.svg#leaguegothic-regular-webfontregular') format('svg');
   font-weight: normal;
   font-style: normal;
}

.montserratregular {
   font-family: 'montserratregular';
}

.leaguegothic-regular-webfont {
   font-family: 'leaguegothic-regular-webfont';
}

.montserratbold {
   font-family: 'monteserratbold';
}

Answer 1

所以它原来是一个服务器问题，字体文件不被识别为在同一台服务器上。这是解决了我的一切代码，放在.htaccess文件中。

  <FilesMatch "\.(ttf|otf|eot|woff)$">
    <IfModule mod_headers.c>
      Header set Access-Control-Allow-Origin "*"
     </IfModule>
  </FilesMatch>

我仍然遇到FOUT的问题，但那是另一天的另一个故事。谢谢大家的帮助！

Answer 2

我有一个类似的问题，IE偶尔会忽略该字体。问题是我使用的字体系列名称包含太多的IE字符，但对所有其他浏览器都运行良好。

尝试缩短名称，尤其是'leaguegothic-regular-webfont'。不确定这是否能解决您的问题，但值得一试。

第一页上的Firefox和Internet Explorer中不会加载Web字体

2 个答案: