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


当前回答

-如果你选择了评分最高的答案,但仍然不起作用:

字体文件夹必须与CSS文件夹在同一级别。修复bootstrap.css中的路径将不起作用。

Bootstrap.css必须像这样导航到Fonts文件夹:

@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');
}

其他回答

我必须创建一些重写条件来允许它们:

RewriteCond %{REQUEST_URI} !(^.+\.ttf)
RewriteCond %{REQUEST_URI} !(^.+\.eot)
RewriteCond %{REQUEST_URI} !(^.+\.svg)
RewriteCond %{REQUEST_URI} !(^.+\.woff)

如果有人在这里结束并使用引导>= v4.0:取消对字形的支持

发行说明中的相关部分:

删除Glyphicons图标字体。如果你需要图标,一些选项是: Glyphicons的上游版本 Octicons 字体太棒了

来源:https://v4-alpha.getbootstrap.com/migration/组件

如果你想使用象形文字,你需要单独下载。

我个人尝试过Font Awesome,它是相当好的。添加图标的方式类似于glypicon:

<i class="fas fa-chess"></i>

正如@Stijn所描述的,当从Nuget安装这个包时,Bootstrap.css中的默认位置是不正确的。

将此部分更改为如下所示:

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

另一个问题/解决方案可能是使用Bootstrap 2。x代码:

<button class="btn" ng-click="open()"><i class="icon-calendar"></i></button>

当基于指南进行迁移时(。图标-*——> .glyphicon .glyphicon-*):

<button class="btn btn-default" ng-click="open()"><i class="glyphicon-calendar"></i></button>

你忘记添加图标类(包含字体引用):

<button class="btn btn-default" ng-click="open()"><i class="glyphicon glyphicon-calendar"></i></button>

读者注意:一定要阅读@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的开发工具显示下载的字体在网络选项卡: