css - 我的网络字体仅适用于Chrome

我正在使用基于bootstrap的网站鞋带子主题。我使用@ font-face更改了我的webfonts，但是它不适用于所有浏览器。仅适用于Chrome。

我该怎么办？

我的CSS代码：

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

h1 { font-family: 'open_sansitalic' sans-serif;  font-size: 40pt; line-height: 50pt; color: #f68934; }

最佳答案

我知道其他浏览器（例如firefox）对字体的位置有非常严格的限制。它要求从与调用网站相同的域中切断字体。尝试在.htaccess文件中插入以下代码。

<FilesMatch "\.(eot|otf|woff|ttf)$">
  SetEnvIf Origin »
    "^http(s)?://(.+\.)?(domain1\.org|domain\.com)$" origin_is=$0
  Header set Access-Control-Allow-Origin %{origin_is}e env=origin_is
</FilesMatch>

关于css - 我的网络字体仅适用于Chrome，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/22232495/