我下载了引导3.0,但无法让象形文字工作。我得到一些"E003"错误。知道为什么会这样吗?我在本地和网上都试过了,还是遇到同样的问题。


当前回答

注意:下面可能是一个小众场景,但我想分享它,以防其他人可能会发现它有用。

在一个rails项目中,我们通过使用bootstrap-sass的rails引擎gem重用了很多东西。除了象形字体路径分辨率外,主项目中一切都很好。

GET http://0.0.0.0:3000/fonts/bootstrap/glyphicons-halflings-regular.woff 404 (Not Found) 

我们发现$bootstrap-sass-asset-helper在解析期间为假,而我们期望它为真,因此路径不同。

我们在引擎gem中初始化了$bootstrap-sass-asset-helper:

// explicit sprockets import to get glyphicon font paths correct
@import 'bootstrap-sprockets';
@import "bootstrap/variables";

例如,这导致路径解析为:

/assets/bootstrap/glyphicons-halflings-regular.woff

同样,这在任何使用bootstrap-sass的正常rails项目中都不应该是必要的,我们只是碰巧重用了很多视图,这对我们来说很有效。希望这能帮助到其他人。

其他回答

读者注意:一定要阅读@user2261073的评论和@Jeff关于定制器中的一个错误的回答。这可能就是你的问题所在。


字体文件没有正确加载。检查文件是否在预期的位置。

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

正如丹尼尔所指出的,这也可能是一种mimetype问题。Chrome的开发工具显示下载的字体在网络选项卡:

我也遇到了同样的问题,浏览器无法找到字体文件,我的问题是由于我的.htaccess文件中排除了不应该发送到index.php进行处理的白名单文件。由于字体文件无法加载,字符被BLOB替换。

RewriteCond %{REQUEST_URI} !\.(jpg|png|gif|svg|css|js|ico|rss|xml|json)$
RewriteCond %{REQUEST_URI} !-d
RewriteRule ^ index.php [L,QSA]

如您所见,像图像、rss和xml这样的文件被排除在重写之外,但是字体文件是.woff和.woff2文件,因此这些文件也需要添加到白名单中。

RewriteCond %{REQUEST_URI} !\.(jpg|png|gif|svg|css|js|ico|rss|xml|json|woff|woff2)$
RewriteCond %{REQUEST_URI} !-d
RewriteRule ^ index.php [L,QSA]

将woff和woff2添加到白名单中可以加载字体文件,并且字形应该正确显示。

如果其他解决方案不起作用,您可能希望尝试从外部源导入Glyphicons,而不是依赖Bootstrap为您完成所有工作。这样做:

你可以在HTML中这样做:

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">

或CSS:

@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css")

来自这个线程的信用edsiofi: Bootstrap 3 Glyphicons CDN

例如,确保你没有过度指定字体族

*{font-family: Verdana;}

将从I元素中删除halflings字体。

我正在看我的这个老问题,因为到目前为止应该是正确答案的答案是我在评论中给出的,我认为我也应该为此得到赞扬。

问题在于,从bootstrap的自定义工具下载的字形字体文件与从bootstrap主页上的重定向下载的字体文件不相同。正常工作的是那些可以从以下链接下载的软件:

http://getbootstrap.com/getting-started/#download

任何对旧的糟糕的定制文件有问题的人都应该从上面的链接覆盖字体。