字体-缺少令人敬畏的图标

Question

我想设计一个网站使用html5和bootstrap.In，我的html代码，我需要字体-令人敬畏的图标。但是当我放入font-awesome.min.css和相应的字体时，Font-Awesome图标没有加载到我的页面中。

因此，当我检查该页面时，我在控制台上收到以下错误和警告：

downloadable font: download failed (font-family: "Roboto" style:normal weight:normal stretch:normal src index:0): bad URI or cross-site access not allowed source: http://[::1]/futuroit/userasset/css/Fonts/Roboto/regular.ttf  style.css:9:1
downloadable font: download failed (font-family: "Roboto" style:normal weight:300 stretch:normal src index:0): bad URI or cross-site access not allowed source: http://[::1]/futuroit/userasset/css/Fonts/Roboto/roboto-light.ttf  style.css:46:1

downloadable font: download failed (font-family: "FontAwesome" style:normal weight:normal stretch:normal src index:1): bad URI or cross-site access not allowed source: http://[::1]/futuroit/userasset/fonts/fontawesome-webfont.woff?v=4.2.0  font-awesome.min.css:4:14
downloadable font: download failed (font-family: "Open Sans" style:normal weight:bold stretch:normal src index:0): bad URI or cross-site access not allowed source: http://[::1]/futuroit/userasset/css/Fonts/Open%20Sans/OpenSans-Regular.ttf

如何解决此问题？

Answer 1

地址错误(或)配置设置丢失

1. 通过直接在浏览器上检查您的地址来验证您的地址，或者只需将源放入并参考路径。
2. 参考此the

Answer 2

尝试包含font-awesome.css插件，而不是font-awesome.min.css，因为有时它会显示错误。当您在html文件中包含此插件时，在所有脚本文件中包含它时，有时也会产生问题。

Answer 3

确保字体使用正确的格式。

对于我来说，Firefox给出了错误：

downloadable font: rejected by sanitizer (font-family: "opensans-semibold" style:normal weight:400 stretch:100 src index:1) source: <path-to-font>/OpenSans-SemiBold.svg

在检查文件时，format()中为svg提供的格式不正确：

url("../fonts/open-sans/open-sans-regular/OpenSans-Regular.svg") format("woff2");

因此，我们为woff2字体提供了svg格式，我将其更正为：

url("../fonts/open-sans/open-sans-regular/OpenSans-Regular.svg") format("svg");

然后问题就消失了！