Question

当我加载页面时，我在终端中收到以下消息：

Not Found: /fonts/glyphicons-halflings-regular.woff2                                                                                                           
[24/Aug/2016 17:19:36] "GET /fonts/glyphicons-halflings-regular.woff2 HTTP/1.1" 404 2238                                                                       
Not Found: /fonts/glyphicons-halflings-regular.woff                                                                                                            
[24/Aug/2016 17:19:36] "GET /fonts/glyphicons-halflings-regular.woff HTTP/1.1" 404 2235                                                                        
Not Found: /fonts/glyphicons-halflings-regular.ttf

我加载此glyphicon的home_page代码位于上方：

{% load staticfiles %}
<link rel="stylesheet" type="text/css" href="{% static 'bootstrapmin.css' %}"/>
<link rel="stylesheet" type="text/css" href="{% static 'style.css' %}" />

<nav class="navbar navbar-inverse">
    <div class="container-fluid">
        <a class="navbar-brand" href="">
            <span class="glyphicon glyphicon-log-out" aria-hidden="true"></span>&nbsp
            <button class="btn-link" type="button"> OntoLogica</button>

        </a>         
    </div>
</nav>

我的引导程序文件位于：

我的项目文件夹
- 静态文件夹
  - bootstrapmin.css
  - 的style.css
  - fonts文件夹
    - 以下是Django找不到的文件

我试图做的事情：

将fonts文件夹的文件移动到bootstrap的相同路径
将fonts文件夹移到静态文件夹之外。

如果您需要我未提供的任何信息，请询问，我会。伙计们，有什么不对？在此先感谢您的帮助！

Answer 1

默认情况下，Bootstrap的CSS定义了字体的相对路径，如下所示：

../fonts/glyphicons-halflings-regular.woff2

这意味着浏览器将尝试查找CSS文件所在目录的fonts目录。对于您的项目结构，意味着它尝试获取/fonts/glyphicons-halflings-regular.woff2而不是/static/fonts/glyphicons-halflings-regular.woff2，这是他们实际所在的位置。

最简单的解决方案是坚持directory structure recommended in the documentation并将所有CSS放在css目录中，该目录与fonts目录位于同一级别：

- static
    - css
       - bootstrap.min.css
       - style.css
    - fonts
       - glyphicons-halflings-regular.woff2

显然，你现在必须引用带有css前缀的文件：

<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
<link rel="stylesheet" href="{% static 'css/style.css' %}">

更复杂的解决方案是下载customised版本的Bootstrap，您可以在其中设置自定义@icon-font-path（请注意默认值："../fonts/"）。使用当前的项目结构，您需要将其更改为"/static/fonts/"。

我的Django项目没有加载Bootstrap glyphicons

1 个答案: