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


当前回答

您必须按以下顺序设置:

<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>

其他回答

您必须按以下顺序设置:

<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>

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

发行说明中的相关部分:

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

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

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

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

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

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

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

在我的情况下,我得到了一个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

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