解决发布ASP.NET网站font awesome图标不显示的问题

解决发布ASP.NET网站font awesome图标不显示的问题

2689发表于2017-07-15

了解过font awesome图标原理的同学都知道font awesome图标css文件里面加载了字体文件.eot和.woff。

如下图:

时候会出现本地是好的,发布到ASP.NET网站服务器IIS上就会有问题。不显示图标,有F12看到加载文件.woff出现404。

一般这种情况都是IIS的MIME类型没有配置对。

目前了解的两种解决方法。

方法一:

一、修改Web.config

在Web.config中的结点system.webServer里面加下一个

staticContent结点,如下:

<staticContent>
  <!--Allow and otf, woff, woff2 file loading (used by fontawesome)-->
  <remove fileExtension=".otf" />
  <remove fileExtension=".woff" />
  <remove fileExtension=".woff2" />
  <mimeMap fileExtension=".otf" mimeType="application/x-font-opentype" />
  <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
  <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
</staticContent>

方法二:

二、在IIS中加上对应的MIME类型


添加以下MIME:

.woff

application/x-font-woff

.woff2

application/x-font-woff

.eot

application/octet-stream

三、总结

推荐用方法一,这样无论部署到哪里都不用在IIS配置,一劳永逸。

小编蓝狐