Bootstrap Glyphicons 不使用本地 Bootstrap 版本呈现

Posted 2023-03-06

【中文标题】Bootstrap Glyphicons 不使用本地 Bootstrap 版本呈现

【英文标题】：Bootstrap Glyphicons not rendering using local Bootstrap version

【发布时间】：2015-04-23 02:54:06

【问题描述】：

我在 django 中使用引导程序，它适用于除图标类之外的所有其他引导程序类，例如：class="glyphicon glyphicon-download-alt"

右下角有错误的快照：

包含 bootstrap.min.css 文件时的快照：

在检查元素时，它包含所有字形图标，其快照是-

只有在我的 html 文件中链接 http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css 时它才有效；但如果我从我的电脑中包含我的bootstrap.min.css，它就不起作用。否则，每个引导类都可以完美运行。希望你能理解我的问题。提前致谢。

【问题讨论】：

您的 PC 中包含的内容是什么意思？你在本地建吗？如果是这样，请在 Chrome 中测试该页面以查看是否出现与 Firefox 中相同的错误。实际上它不一定是 Chrome，但至少是非 Mozilla 的浏览器。

不，我已经从上面的链接下载并保存在我的电脑中，它适用于所有引导类

你也下载了 glyphicons 字体吗？

不，他们不是。请重新阅读我的答案。您复制的 CSS 仅包含指向字形图标的链接，而不是实际字体本身。

成功了。非常感谢。

【参考方案1】：

它不起作用，因为您从 CDN 链接保存了 CSS 文件。那是行不通的，因为字形图标是相对于该 CSS 文件链接的。示例：

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

这意味着，下载的 Bootstrap 文件正在您的计算机上（您没有）文件夹中寻找字形图标。

您需要从the official download link 正确下载Bootstrap。此官方下载包含一个 /fonts/ 目录，其中包含实际的 glyphicon 字体文件。

或者，您可以将 CDN 文件中的所有字体路径更改为指向 CDN 上字体的绝对链接……但这没有任何意义。

【讨论】：

我试过了，但还是不行。它的快照包含所有 Glyphicons 文件。请帮忙。

如果您下载官方压缩包，它可以直接使用。唯一不会的方法是在不更改相对链接的情况下移动某些内容。

实际上我在 django 中工作，我只是将 css 文件复制到我的静态文件夹中，它适用于其他类。还告诉我什么是CDN。谢谢

您可能还需要将fonts 文件夹复制到您的静态文件夹中。

谢谢，一直在寻找解决这个问题的方法！

【参考方案2】：

我的问题终于解决了。实际上问题是在我们的网站中使用 Glyphicons 时，例如在 django 中，我们还必须从 bootstrap official link 下载的 bootstrap-3.3.2-dist 文件夹中复制字体文件夹

另一个问题是在哪里修复它。查看字体与 css 文件相关的结构，然后粘贴字体文件夹。

引导程序/ ├── 少/ ├── js/ ├── 字体/ ├── 距离/ │ ├── css/ │ ├── js/ │ └── 字体/ └── 文档/ └── 例子/

但它在静态文件夹内的 django 中对我有用。

【讨论】：

我认为只需将 bootstrap.min.css 切换为 dist 中包含的那个即可解决问题。