Question

我想将gallery.html和gallery.css放在base.html内。我已经运行collectstatic和runserver但是当我使用chrome dev工具检查时，找不到gallery.css和html。只能找到并显示base.html和css。

以下是我项目的简要结构：

/proj
   /gallery
      /static
         /css
            gallery.css
      /templates
         gallery.html
   /proj
   /templates
      base.html
   /static
      /css
         base.css

base.html文件：

{% load staticfiles %}

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 101 Template</title>

    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
    <!-- Base css -->
    <link rel="stylesheet" type="text/css" href="{% static "css/base.css" %}">

  </head>
  <body class="background">
    <div class="wrapper">   
      {% block content %}
        <!-- content here-->
      {% endblock %}
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
  </body>
</html>

gallery.html：

{% extends "base.html" %}


{% block content %}

<!-- container for photos-->
<script type="text/javascript" src="{% static "js/masonry.pkgd.minjs" %}"></script>
<link rel="stylesheet" type="text/css" href="{% static "css/gallery.css" %}">
<div class="gallery-container">
    dsfsdfdsfdsf
</div>

{% endblock %}

gallery.css：

.gallery-container {
    background-color: red;
    width: 50%;
    height: 50%;
    margin: 0px;
    padding: 0px;
}

base.css

html, body {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;

}
.background {
    background-color:#b0a0e6;
}

.wrapper {
    background-color: grey;
    height: 100%;
    width: 75%;
    margin-left: auto;
    margin-right: auto;
    overflow:auto;
}

settings.py

STATIC_URL = '/static/'

STATICFILES_FINDERS = (
    'django.contrib.staticfiles.finders.FileSystemFinder',
    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
)

STATICFILES_STORAGE = (
    'django.contrib.staticfiles.storage.StaticFilesStorage'
)

STATIC_ROOT = os.path.realpath(os.path.join(BASE_DIR, '..', 'websiteAssets'))

STATICFILES_DIRS = (
     os.path.join(BASE_DIR, 'static'),
)     

TEMPLATE_DIRS = (
    os.path.join(BASE_DIR,'templates'),
    os.path.join(BASE_DIR,'home/templates'),
    os.path.join(BASE_DIR,'gallery/templates'),
    os.path.join(BASE_DIR,'contact/templates'),
    os.path.join(BASE_DIR,'aboutme/templates'),
)

Answer 1

使用第{% static 'css/gallery.css' %}行，您正试图获取位于目录＆＃c; css＆＃39;中的静态文件gallery.css。但是这个目录并不存在，因为图库只放在目录＆＃39; static＆＃39;而不是静态/ css＆＃39;。尝试通过{% static 'gallery.css' %}或创建目录来实现目标＆＃39; css＆＃39;在static中并将gallery.css放入其中。

Answer 2

旧问题，我确定您已找出解决方案或继续前进，但您需要添加：

{% load static %}

在gallery.html下面的{% extends 'base.html' %}中

。 Django模板要求您在正在使用它们的任何模板上加载静态文件，无论它们是否包含在您要扩展的模板中。有关更好的参考信息，请参阅here。

将应用程序模板和静态文件导入其他模板Django

2 个答案: