Bootstrap 3 无法正确显示字形 [英] Bootstrap 3 unable to display glyphicon properly

问题描述

我正在从 bootstrap 2.3 迁移到 bootstrap 3，一切正常.但是当我尝试添加一些图标时，图标字体显示不正确.我试着在这里查看 http://bootply.com/61521 并且只有 '.glyphicon-envelope'正确显示.其他已经显示为E001"等.

I am migrating from bootstrap 2.3 to bootstrap 3 and everything works well. But when I tried to add some icons, the icon font doesn't displayed properly. I tried to look over here http://bootply.com/61521 and only '.glyphicon-envelope' was being displayed properly. Others have displayed like 'E001' and so on.

我怎样才能解决这个问题?

How can I be able to solve this problem?

其他浏览器可以正常显示glyphicon，只有firefox无法正常显示.

For other browsers, glyphicons are displayed properly, only firefox was unables to display it properly.

推荐答案

好的，上面没有回答我的问题.我的字体文件夹与 bootstrap css 和 js 文件夹(例如/theme/bootstrap3/..)位于同一位置，但它正在寻找根目录中的字体文件夹(例如/fonts/glyph.. .woff)

OK, my problem was not answered by the above. I had the fonts folder at the same location as the bootstrap css and js folders (eg /theme/bootstrap3/..), but it was looking for the font folder in the root (eg /fonts/glyph.. .woff)

我的解决方案是将@icon-font-path 变量设置为正确的相对路径:

The solution for me was to set the @icon-font-path variable to the correct relative path:

例如@icon-font-path: "fonts/";

Eg @icon-font-path: "fonts/";

这篇关于Bootstrap 3 无法正确显示字形的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！