Bootstrap glyphicons（fonts / ****。woff）无法加载 [英] Bootstrap glyphicons (fonts/****.woff) not loading

问题描述

我试图使用自举图形在Google chrome（56.0.2924.87）控制台中看起来像这样。

//i.stack.imgur.com/ZYf57.jpgrel =nofollow noreferrer>

即使我的.woff文件和.ttf文件位于我的public / css / fonts文件夹中。

添加信息

我使用Wampserver与apache（2.4.23）

我用npm install bootstrap安装了bootstrap.css。

这就是我的font-face看起来像

  @ font-face {
 font-family：'Glyphicons Halflings'; 
 font-style：italic; 
 src：url（'/ public / css / fonts / glyphicons-halflings-regular.eot'）; 
 src：url（'/ public / css / fonts / glyphicons-halflings-regular.eot？#iefix'）format（'embedded-opentype'），url（'/ public / css / fonts / glyphicons-halflings （'/ public / css / fonts / glyphicons）格式（'woff'），url（'/ public / css / fonts / glyphicons-halflings-regular.woff'）格式（''public / css / fonts / glyphicons-halflings-regular.svg＃glyphicons_halflingsregular'）格式（'svg'）; 
  

}

像这样调用图形：

 < i class =glyphicon glyphicon-chevron-left> < I> /; 
  

有没有人知道这个问题的位置？

解决方案

仔细检查@ font-face位置路径以及MIME类型。

I am an error getting that looks like this in my Google chrome(56.0.2924.87) console while trying to use bootstrap glyphicons

Even though i have my .woff files and .ttf files located in my "public/css/fonts" folder.

Addtional Information

I am using Wampserver with apache(2.4.23)

I installed bootstrap.css with "npm install bootstrap"

This is what my font-face looks like

@font-face {
  font-family: 'Glyphicons Halflings';
  font-style: italic;
  src: url('/public/css/fonts/glyphicons-halflings-regular.eot');
  src: url('/public/css/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/public/css/fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('/public/css/fonts/glyphicons-halflings-regular.woff') format('woff'), url('/public/css/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('/public/css/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');

}

I try to call the glyphicons like this:

<i class="glyphicon glyphicon-chevron-left"></i>

Does anyone have any idea where this problem might be located?

解决方案

Double check @font-face location path and also the mime type.

这篇关于Bootstrap glyphicons（fonts / ****。woff）无法加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！