css - Django CSS静态文件随机停止工作

Question

我和 django 的关系快结束了。一切都很顺利，直到我的 CSS 文件停止工作。我没有改变任何东西。我尝试更改标题的颜色，但它不会改变。我刷新了所有内容并 ctrl + C。CSS 没有更改，而是完全停止工作，我无法让它再次工作。当我运行 python manage.py runserver 时，我得到：

[24/Feb/2021 18:19:53] "GET /dreamboard/ HTTP/1.1" 200 11844
[24/Feb/2021 18:19:53] "GET /static/css/main.css HTTP/1.1" 304 0
[24/Feb/2021 18:19:53] "GET /dreamboard/ HTTP/1.1" 200 11844

看起来它可以正常访问 CSS 文件。这是我的其他文件：

设置.py

"""
Django settings for mysite project.

Generated by 'django-admin startproject' using Django 3.1.6.

For more information on this file, see
https://docs.djangoproject.com/en/3.1/topics/settings/

For the full list of settings and their values, see
https://docs.djangoproject.com/en/3.1/ref/settings/
"""

from pathlib import Path

# Build paths inside the project like this: BASE_DIR / 'subdir'.
BASE_DIR = Path(__file__).resolve().parent.parent


# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/3.1/howto/deployment/checklist/

# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = '$hggs$iztdeeb@x0b=5y42ykz((un)jtmf--$1$z2778(we5@8'

# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True

ALLOWED_HOSTS = []

STATICFILES_DIRS = [
    "/Projects/HokieBoard/mysite/dreamboard/static",
]


# Application definition

INSTALLED_APPS = [
    'dreamboard',
    'crispy_forms',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
]

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

CRISPY_TEMPLATE_PACK = 'bootstrap4'

ROOT_URLCONF = 'mysite.urls'

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

WSGI_APPLICATION = 'mysite.wsgi.application'


# Database
# https://docs.djangoproject.com/en/3.1/ref/settings/#databases

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.postgresql',
        'NAME': 'dreamboard',
        'USER': 'postgres',
        'PASSWORD': 'password',
        'HOST': '127.0.0.1',
        'PORT': '5432',
    }
}


# Password validation
# https://docs.djangoproject.com/en/3.1/ref/settings/#auth-password-validators

AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
    },
]


# Internationalization
# https://docs.djangoproject.com/en/3.1/topics/i18n/

LANGUAGE_CODE = 'en-us'

TIME_ZONE = 'UTC'

USE_I18N = True

USE_L10N = True

USE_TZ = True


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.1/howto/static-files/

STATIC_URL = '/static/'

# Django Admin Password and Username
# admin password



]

视图.py

from django.shortcuts import render, redirect
from django.http import HttpRequest
from .models import dream
from .forms import DreamForm

from django.views.generic.base import TemplateView

from . import urls

# Create your views here.


def index(request):



    if request.method == "GET":
        form = DreamForm()
        return render(request, 'dreamboard/index.html', {'form':form, 'dreamboard_dream': dream.objects.all()})
    else:
        form = DreamForm(request.POST)
        if form.is_valid():
            form.save()
        return render(request, 'dreamboard/index.html', {'form':form, 'dreamboard_dream': dream.objects.all()})
        #return redirect('index')


def home(request):
    return render(request, 'dreamboard/home.html')

索引.html

{% load static %}




<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">


    {% load crispy_forms_tags %}






    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="{% static 'css/main.css' %}">
    <script src="https://kit.fontawesome.com/73cead4581.js" crossorigin="anonymous"></script>

    <title>Hello, world!</title>


  </head>
  <body class="bg-light">
    <h1>Hello, world!</h1>

    <div class="container">
  <div class="row bg-dark">
    <div class=" col-sm">
      <h1 style="color:white">Dreamboard</h1>
    </div>
    <div class="col-sm">


          <button class="btn-lg btn-primary" type="submit">Add Dream</button>
      </div>
    </div>
  </div>
</div>



<form class="" action="" method="post" autocomplete="off">
    {% csrf_token %}
  <div class="row">
      <div class="col-md-6">
          {{form.first_name|as_crispy_field}}
      </div>
      <div class="col-md-6">
          {{form.last_name|as_crispy_field}}
      </div>
  </div>
  {{form.dreamItem|as_crispy_field}}
  <br>
  <button type="submit" class="d-grid gap-2 col-12 btn btn-success">Submit</button>

</form>

{% for dream in dreamboard_dream %}

<div class="panels">

<div class="accordion accordion-flush" id="accordionFlushExample">
  <div class="accordion-item">
    <h2 class="accordion-header" id="flush-headingOne">
      <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseOne" aria-expanded="false" aria-controls="flush-collapseOne">
        {{ dream.dreamItem }}
      </button>
    </h2>
    <div id="flush-collapseOne" class="accordion-collapse collapse" aria-labelledby="flush-headingOne" data-bs-parent="#accordionFlushExample">
      <div class="accordion-body">{{dream.first_name}} {{dream.last_name}}</div>
    </div>
  </div>
</div>
  {% endfor %}

  <div class="popup" id="popup-1">
    <div class="overlay"></div>
    <div class="content">
      <div class="close-btn" onclick="togglePopup()">&times;</div>
      <script src="{% static 'js/main.js' %}"></script>
      <h1>Title</h1>
      <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Illo aspernatur laborum rem sed laudantium excepturi veritatis voluptatum architecto, dolore quaerat totam officiis nisi animi accusantium alias inventore nulla atque debitis.</p>
    </div>
  </div>

  <button onclick="togglePopup()">Show Popup</button>



    <!-- Optional JavaScript; choose one of the two! -->

    <!-- Option 1: Bootstrap Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>

    <!-- Option 2: Separate Popper and Bootstrap JS -->
    <!--
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js" integrity="sha384-q2kxQ16AaE6UbzuKqyBE9/u/KzioAlnx2maXQHiDX9d4/zp8Ok3f+M7DPm+Ib6IU" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.min.js" integrity="sha384-pQQkAEnwaBkjpqZ8RU1fF1AKtTcHJwFl3pblpTlHXybJjHpMYo79HY3hIi4NKxyj" crossorigin="anonymous"></script>
    -->
  </body>
</html>

main.css

title {
  color: blue;
}

.title {
  color: blue
}

body {
  background-color: blue
}

我脑子里有很多雄心勃勃的项目。我真的需要我的 CSS 文件在未来工作。谢谢！

标签： cssdjangodjango-templates