Bootstrap 没有显示几个字形图标答案

【问题标题】：Bootstrap few glyphicons are not showingBootstrap 没有显示几个字形图标
【发布时间】：2017-12-01 09:20:35
【问题描述】：

当我访问网站https://getbootstrap.com/docs/3.3/components/ 时，我可以从不同的字形图标中进行选择。

问题是底部的图标不起作用。例如：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<!-- showing -->
<span class="input-group-addon"><i class="glyphicon glyphicon-random color-blue"></i></span>

<!-- not showing -->
<span class="input-group-addon"><i class="glyphicon glyphicon-option-horizontal"></i></span>

在我的 asp.net (vb) 项目中使用的 bootstrap 和 jquery 版本之下：
Bootstrap：3.3.7
jQuery：3.2.1

有没有办法可以添加这些字形图标？
根据引导站点，那些不显示图标的应该适用于 3.3.7

【问题讨论】：

嗨！能提供jsbin或者codepen的例子吗？
我在您的问题中添加了一个可执行的 sn-p 似乎工作正常。检查您自己的版本以确保控制台中没有错误，或覆盖 Bootstrap 的 CSS 规则
sn-p 似乎工作正常。也许尝试在页眉中包含 CSS，在页脚中包含 JS？
感谢大家的快速回复。我在 jsbin 上检查了它，它确实工作了
提示：使用fontawesome.io

标签： jquery html css twitter-bootstrap

【解决方案1】：

当您查看引导 CSS 时，您可以看到图标实际上是一种图标字体。

@font-face{
    font-family:'Glyphicons Halflings';
    src:url(../fonts/glyphicons-halflings-regular.eot);
    src:url(../fonts/glyphicons-halflings-regular.eot?#iefix) 
    .......
}

如果您想要显示这些图标，您必须确保您的浏览器可以找到这些字体。

【讨论】：

【解决方案2】：

对不起，这是我自己的错。

检查后，bootstrap 版本文件为 3.0.0。对 3.3.7 进行了更新，现在可以使用了。

【讨论】：