如何在 Django 中扩展为“base.html”模板样式
Posted
技术标签:
【中文标题】如何在 Django 中扩展为“base.html”模板样式【英文标题】：How to extend to 'base.html' template styles in Django 【发布时间】：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）仍然没有获得样式。谢谢 【参考方案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 文件中，你有这样的这些行吗？ 看看这里：***.com/questions/24238496/…以上是关于如何在 Django 中扩展为“base.html”模板样式的主要内容，如果未能解决你的问题，请参考以下文章
Django - 如何在 base.html 中传递上下文？
如何在 Django 的 base.html 中插入多个块？