如何在 Django 中扩展为“base.html”模板样式答案

【问题标题】：How to extend to 'base.html' template styles in Django如何在 Django 中扩展为“base.html”模板样式
【发布时间】：2016-07-12 12:42:50
【问题描述】：

我在我的应用程序中使用模板。我在 base.html 中设置了网站的主要部分，这些文件始终是相同的（页眉、菜单、页脚......），在“base.html”中正确编码以及链接到它的样式（在链接中 rel="stylesheet")。

当我尝试按原样使用基本模板时，它运行良好，同时它允许我在 de {% block content %} 之间添加内容并显示“永久”部分（菜单、标题等），但上面没有样式（CSS）。我怎样才能扩展到这些样式表来加载 CSS 样式？？

我们将不胜感激，谢谢。

编辑 2：这是我的 base.html 头内容：

    <head>
<meta charset="utf-8">
{% load staticfiles %}
<title>{% block title %}Index{% endblock %}</title>
{% block style_base %}
<link href="{% static 'css/styles.css' %}" rel="stylesheet">
{% endblock %}
<meta name="description" content="{% block description %}{% endblock %}">
<link href='https://fonts.googleapis.com/css?family=Roboto+Mono:400,700,300' rel='stylesheet' type='text/css'>
<script src="static/myapp/jquery.min.js" type="text/javascript"></script>
<script src="static/myapp/main.js" type="text/javascript"></script>
</head>

这适用于 base.html，它获得了正确的样式。但是，当尝试使用另一个模板在公共部分中获取相同的样式时，它不会获取样式。模板代码是这样开始的：

{% extends "base.html" %}
{% load staticfiles %}
{% load i18n %}
{% include "base.html" %}
{% block title %}{% trans "Main index" %}{% endblock %}
{% block content1 %}

它从 base.html 获取所有正确的 HTML，但没有样式。我也尝试删除“包含”标签或更改其位置，但没有结果。有什么问题？谢谢。

另外，控制台告诉我：

Not Found: /list/static/myapp/styles.css
[25/Mar/2016 01:03:03] "GET /list/static/myapp/styles.css HTTP/1.1" 404 3414

当我刷新页面（列表是我想从基础获取样式的模板的页面）时，它一直告诉我这一点。 List 不是我项目中的目录，但是 /static/myapp/styles.css 路径是正确的。会发生什么？

【问题讨论】：

你能显示你的基本模板吗？
我已经编辑了帖子。谢谢
您可以查看静态文件的 url。虽然 'localhost/static/css' 有效。 'localhost/something/static/css' 不会。
我不知道我是否正确理解了您的答案，但我已经更改并为 css 文件创建了一个名为“css”的目录，并更改了 base.html 中的 URL。它运行良好，但另一个模板（扩展 base.html）仍然没有获得样式。谢谢

标签： python django templates

【解决方案1】：

您必须在 base.html 中调用 CSS 文件，因此当您在其他页面中扩展 base.hml 时，将调用 CSS。

对我来说，我通常这样做：

我有 Head.html 我在其中调用我在网站中使用的所有 Javascript 和 CSS 文件，如下所示：

对于 CSS：

<link rel="stylesheet" type="text/css" href="/static/styles/example.css"/>

对于 javascript：

<script type="text/javascript" src="/static/js/example.js"></script>

然后，在网站的每个页面中，在标题标签之后，我将这个 Head.html 包含在内：

{% include "Head.html" %}

当您在每个页面中执行此操作时，CSS 和 javascripts 文件将在所有页面中显示并可调用。

另外，主urls.py文件应该是这样的：“答案来自here”

urlpatterns = [ # ... the rest of your URLconf goes here ...
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

【讨论】：

是的，但我应该怎么做呢？我应该将代码与扩展 base.html 的所有其他模板中的“扩展 base.html”分开吗？在 base.html 中调用 CSS 文件的代码是什么？找不到。。谢谢。
感谢您的回答。但是，当我尝试它时，输出仍然显示没有样式的纯文本。我试图链接头部的模板看起来像： {% extends 'base.html' %} {% load i18n %} {% load staticfiles %} {% block title %}{% trans "Title" %}{% endblock %} {% include "base.html" %} 应该这样吗？
对我来说，我会在 base.html 中调用 {% load staticfiles %}。其他可能性是答案中的新行，您也可以检查它。
再次感谢您的回答，但我尝试过但没有成功。我已经用更多信息编辑了第一篇文章。谢谢

【解决方案2】：

在您的 html 文件顶部添加以下内容：

{% extends "base.html" %}

【讨论】：

您指的是哪个 html 文件？它位于我想与“base.html”链接的模板之上。它运行良好，它确实扩展到 base.html 上的 html 代码（这很棒），但它没有选择我想要的样式。对此有任何想法吗？谢谢
我的意思是在你的模板中。但是你应该在 style_base 标签中定义你的样式。在你的 base.html 中这样写你的样式： {% block style_base %} {% endblock %}
再次感谢您的回答。我已经更改并添加了这个模板标记系统来定义 base.html 中的样式，它适用于 base.html（它仍然具有样式）。然而，在我想扩展的模板中，它仍然缺少加载样式。我用我想要链接到 base.html 的模板的第一行代码编辑了第一篇文章，希望我能找出问题所在......再次感谢您。

【解决方案3】：

应该可以了，可能是css路径不对，或者尝试删除你的{%block style_base%}

【讨论】：

但是如果样式在'base.html'中运行良好，路径不会错吧？我不知道还能尝试什么，它不起作用...谢谢您的回答。
我只是再试一次，但控制台仍然一次又一次地显示相同的消息...为什么？
STATIC_URL = '/static/' STATICFILES_DIRS = [ os.path.join(BASE_DIR, 'static'), ]
在你的 settings.py 文件中，你有这样的这些行吗？
看看这里：stackoverflow.com/questions/24238496/…