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

*{font-family: Verdana;}

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

我从NuGet得到Bootstrap。当我发布我的网站时，符号不起作用。

在我的案例中，我通过将每个字体文件的构建动作设置为“内容”并将其设置为“始终复制”来工作。

我遇到了这个问题，它是由变量引起的。更少的文件。重写它以设置icon-font-path值解决了这个问题。

文件结构如下所示:

\Content
        \Bootstrap
        \Fonts
 styles.less
 variables.less

添加我自己的变量。在Content的根目录中添加less文件，并在样式中引用它。Less解决了404错误。

变量。不包含:

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

您必须按以下顺序设置:

<link rel="stylesheet" href="path/bootstrap.min.css"> 
<style type="text/css"> 
     @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'); } 
</style>

另一个问题/解决方案可能是使用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>

在我的情况下，我得到了一个404的glyphicons-halfling -regular。Woff，以及移动浏览器上不可见的象形文字。

看起来woff的MIME类型有些混乱，不同的浏览器接受多种MIME类型，但是W3C说:

application/font-woff

编辑:在测试以下MIME类型的woff作品目前在所有浏览器:

application/x-font-woff

编辑:目前Bootstrap的最新版本(3.3.5)使用。woff2字体，初始结果与。woff相同，W3C仍然在定义规范，但目前MIME类型似乎是:

application/font-woff2