icoMoon字体不';Firefox上没有显示

icoMoon字体不';Firefox上没有显示,firefox,sass,font-face,Firefox,Sass,Font Face,Firefox上使用图标替换字体的跨浏览器没有问题,目前只显示内容文本,而不显示图标替换文本。源代码显示从代码Sass+Magento+.htaccess,任何想法或帮助将不胜感激 网站: 已完成。htaccess重写: AddType image/svg+xml svg svgz AddEncoding gzip svgz AddType application/vnd.ms-fontobject eot AddType font/truetype ttf AddType font/open

Firefox上使用图标替换字体的跨浏览器没有问题,目前只显示内容文本,而不显示图标替换文本。源代码显示从代码Sass+Magento+.htaccess,任何想法或帮助将不胜感激

网站:

已完成。htaccess重写:

AddType image/svg+xml svg svgz
AddEncoding gzip svgz
AddType application/vnd.ms-fontobject eot
AddType font/truetype ttf
AddType font/opentype otf
AddType application/x-font-woff woff

<FilesMatch ".(ttf|otf|eot|woff)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Origin "http://www.phoebessecret.co.nz"
Header set Access-Control-Allow-Origin "http://skin.phoebessecret.co.nz"
Header set Access-Control-Allow-Origin "http://js.phoebessecret.co.nz"
Header set Access-Control-Allow-Origin "http://media.phoebessecret.co.nz"
</IfModule>
</FilesMatch>
@font-face {
font-family: 'topshops';
src:url('../fonts/topshops.eot');
src:url('../fonts/topshops.eot?#iefix') format('embedded-opentype'),
    url('../fonts/topshops.svg#topshops') format('svg'),
    url('../fonts/topshops.woff') format('woff'),
    url('../fonts/topshops.ttf') format('truetype');
font-weight: normal;
font-style: normal;}

.icon-fonts {
    font-family: 'topshops';
    font-style: normal;
    speak: none;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    font-weight: 400;
}

.iconsearch {
    content: "\61";
}

我对icomoon和Firefox也有问题。你试过了吗?这和icomoon的输出有点不同,我的运气更好——从那以后就没有FF问题了

@font-face {
    font-family: 'Graublau Web';
    src: url('GraublauWeb.eot?') format('eot'), url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf') format('truetype');
}

尝试将其添加到.htaccess文件中。 它会解决你的问题。它修好了我的

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

标题集访问控制允许原点“*”
我也遇到了同样的问题(在Wordpress安装中),Firefox中没有显示图标。铬合金、Safari(效果很好)


该站点启动并运行后,客户要求我在url中包含www,而不仅仅是http://。所以我更改了博客地址,但没有更改Wordpress地址(在Wordpress仪表板中)。突然间,所有的月亮图标都消失了。将www添加到Wordpress地址后,图标又回来了

有两件事你可以试试。我两者都用了,这对我来说很有效。 使用CSS文件中的完整链接来引用icomoon。您的.htaccess可能正在重写URL。其次,正如
webkub
指出的那样,在.htaccess文件中添加以下内容

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

标题集访问控制允许原点“*”

如果您运行的是IIS,则需要修改web.config,并可能添加httpProtocol部分,如下所示:

<?xml version="1.0" encoding="utf-8"?>
  <configuration>
    <system.webServer>
      <httpProtocol>
        <customHeaders>
          <add name="Access-Control-Allow-Origin" value="*" />
       </customHeaders>
     </httpProtocol>
   </system.webServer>
  </configuration>


+1我发现它们非常相似,并尝试了几乎没有希望的解决方案,但它奏效了!从子域调用我的页面时,icomoon出现问题。这为我解决了这个问题。谢谢。这也解决了我从其他域调用图标字体文件时的问题。这可能与Firefox的跨域请求阻止实现有关。