引导字形图标不显示

Question

我有这个 html 页面：

 <link rel="shortcut icon" type="image/png" href="{% static "images/favicon.ico" %}"/>
      <link rel="stylesheet" type="text/css"  href="{% static "css/bootstrap.css" %}">
      <link rel="stylesheet" type="text/css"  href="{% static "css/bootstrap-theme.css" %}">
      <link rel="stylesheet" type="text/css"  href="{% static "fonts/font-awesome.min.css" %}">
      <link rel="stylesheet" type="text/css"  href="{% static "css/custom.css" %}" media="screen">

    <script src="{% static "js/jquery.min.js" %}"></script>
    <script src="{% static "js/bootstrap.min.js" %}"></script>
    <script type="text/javascript" src="{% static "js/added.js" %}"></script>
[...]
 <i class="glyphicon glyphicon-thumbs-up" id="like" name="{{post.id}}"> </i> 

在 Chrome 和 Firefox 上都不会显示竖起大拇指图标，尽管事实上所有 css 文件都已加载并且引导 css 呈现正常。

我查看了关于 SO 的类似问题，但找不到我的答案。非常感谢您的帮助。

Answer 1

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

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

如果这不起作用，我建议您重新下载引导文件并确保所有文件都已复制并位于正确的路径中。