Question

这是我的项目目录简要的样子（不完整的图片）。我无法将多个组件链接在一起（.css，.html）。

├── bootstrap-3.3.5-dist
└── mysite
    ├── db.sqlite3
    ├── myApp
    │   ├── admin.py
    │   ├── forms.py
    │   ├── __init__.py
    │   ├── templates
    │   │   └── myApp
    │   │       ├── base.html
    │   │       ├── base_menu.html
    │   │       ├── main.css
    │   ├── tests.py
    │   ├── urls.py
    │   └── views.py

在上面的树中，base.html是我的主要网站。我想在main.css的{{1}}中添加<head>，但路径不正确。

base.html

我尝试了<link rel="stylesheet" href="main.css">，myApp/main.css，等等...我不仅无法链接我的templates/myApp/main.css，我还想使用{{1}的模板继承同样的问题 - 相对路径是不正确的。

这是我目前的主要障碍，请帮助。感谢。

Answer 1

静态资源

我们通常不会使用Django路由到所谓的＆＃34;静态＆＃34;资源。这背后的原因是让你的服务器启动一个调用Django的Python应用程序是一种浪费，这样你就可以找到并回流一个＆＃34;静态＆＃34;或不变的文件。 Django用于呈现动态响应（例如带有模板标记的HTML，其中您将注入一些内容）。

无论如何，考虑到这一点，一个典型的Django项目经常组织这样的事情（我删除了myApp/templates内的子目录以简化事情）：

├── bootstrap-3.3.5-dist
└── mysite
    ├── db.sqlite3
    ├── myApp
    │   ├── admin.py
    │   ├── forms.py
    │   ├── __init__.py
    │   ├── static
    │   │   └── myApp
    │   │       ├── main.css
    │   │       ├── some.js
    │   ├── templates
    │   │    ├── base.html
    │   │    ├── base_menu.html
    │   ├── urls.py
    │   └── views.py

然后，在setings.py中，您设置了两个重要变量：

# This is the url that static routes will reverse to
STATIC_URL = '/static/'
# This is the place where static files actually live
STATIC_ROOT = '/location/for/storing/static/files'

之后，您可以运行以下命令：

 $ python manage.py collectstatic

Django将收集所有静态文件（在应用程序内的静态目录中），并将它们全部转储到上面指定位置的目录中。

最后，这将允许您在模板中反转静态网址，如下所示：

{% load staticfiles %}
<link rel="stylesheet" href="{% static "myApp/main.css" %}">

当你在本地提供内容时，这可能会有点混乱，因为（与上面所说的相反）你需要定义一个url路由（如果你使用的是django＆＃39; s runserver命令），所以Django知道如何提供将导致这些静态文件的路由。

请参阅how to serve staticfiles in development和another stackoverflow answer

模板继承

至于模板继承，也许缺少的见解是这样的：模板标签之间的东西由Django呈现，然后整个响应被发回。

这是一个快速演示：

模板文件：myApp/templates/about.html

{% extends 'index.html' %}

{% block maincontainer %}
<div class="container">
  <p>
    Some content.
  </p>
</div>
{% endblock maincontainer %}

模板文件：myApp/templates/index.html

<html>
  <head>
    {% load staticfiles %}
    <link rel="stylesheet" href="{% static "myApp/main.css" %}">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.js"></script>
    <link 
  </head>
  <body>
    {% include "base_menu.html" %}
    {% block maincontainer %}
    {% endblock maincontainer %}
  </body>
</html>

这是你的Django视图对这些模板的作用：

您告诉它呈现about.html。它将解析和评估模板标记指示符{%和%}之间的所有内容。
它看到您希望此模板extend另一个模板index.html，因此它会神奇地找到该模板并对其执行第1步。
index.html包含行include base_menu.html，因此Django会神奇地找到该模板，执行步骤1并将所有内容插入到include语句的位置。
Django找到模板标记static blabla，因此它为那里引用的静态文件执行urlreverse（意思是，它创建了一个引用静态文件的完整URL）。
最后，在使用index.html和任何其他包含的模板完成后，回到about.html，它会看到您要覆盖index.html中定义的内容块因此它将index.html中定义的块替换为about.html中定义的重写块。

之后，它完成了，它将完成的模板（现在只是一个大字符串）发送回任何请求的模板。这可能包括以下标记：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.js"></script>

您的浏览器负责确定如何处理此行。这就是为什么你第一次尝试包含css失败了：浏览器试图在磁盘上找到该文件并且不知道它在哪里。

Django webframework .css和其他.html文件的相对路径

1 个答案: