DjangoのCSSを反映させたい
ここに質問の内容を詳しく書いてください。
Djangoでblogサイトを作っています。
スーパーリロードをしてもCSSが反映されず、困っています。
発生している問題・エラーメッセージ
"GET /static/css/style.css HTTP/1.1" 404 1663 "GET /favicon.ico HTTP/1.1" 404 2985
該当のソースコード
html
1login.html 2{% extends "app/base.html" %} 3{% load widget_tweaks %} 4 5{% block content %} 6<div class="card card-auth my-5 mx-auto"> 7 <div class="card-body"> 8 <h5 class="card-title text-center">ログイン</h5> 9 <form method="post" class="form-auth"> 10 {% csrf_token %} 11 <div class="form-label-group"> 12 {% render_field form.login class="form-control" placeholder="ユーザー名" %} 13 </div> 14 <div class="form-label-group"> 15 {% render_field form.password class="form-control" placeholder="パスワード" %} 16 </div> 17 <div class="text-center"> 18 <button class="button btn btn-primary" type="submit">ログイン</button> 19 </div> 20 </form> 21 </div> 22</div> 23 24{% endblock %}
html
1base.html 2{% load static %} 3 4<!DOCTYPE html> 5<html lang="ja"> 6<head> 7 <meta charset="UTF-8"> 8 <meta name="viewport" content="width=devise-width, initial-scale=1.0"> 9 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css"> 10 <link rel="stylesheet" href="{% static 'css/style.css' %}"> 11 <title>ブログ</title> 12</head> 13<body> 14 <nav class="navbar navbar-expand-lg navbar-dark bg-dark"> 15 <div class="container"> 16 <a class="navbar-brand" href="/">ブログ</a> 17 <ul class="navbar-nav ml-auto"> 18 <li class="nav item"> 19 <a class="nav-link" href="/">ホーム</a> 20 </li> 21 {% if user.is_authenticated %} 22 <li class="nav-item"> 23 <a class="nav-link" href="{% url 'post_new' %}">投稿</a> 24 </li> 25 <li class="nav-item"> 26 <a class="nav-link" href="">ログアウト</a> 27 </li> 28 {% else %} 29 <li class="nav-item"> 30 <a class="nav-link" href="">サインアップ</a> 31 </li> 32 <li class="nav-item"> 33 <a class="nav-link" href="{% url 'account_login' %}">ログイン</a> 34 </li> 35 {% endif %} 36 </ul> 37 </div> 38 </nav> 39 40 <main> 41 <div class="container"> 42 {% block content %} 43 {% endblock %} 44 </div> 45 </main> 46 47 <footer class="py-2 bg-dark"> 48 <p class="m-0 text-center text-white">Copyright © Django Startup 2020</p> 49 </footer> 50 51 {% block extra_js %} 52 {% endblock %} 53</body> 54</html>
py
1setting.py 2""" 3Django settings for mysite project. 4 5Generated by 'django-admin startproject' using Django 2.2.24. 6 7For more information on this file, see 8https://docs.djangoproject.com/en/2.2/topics/settings/ 9 10For the full list of settings and their values, see 11https://docs.djangoproject.com/en/2.2/ref/settings/ 12""" 13 14import os 15 16# Build paths inside the project like this: os.path.join(BASE_DIR, ...) 17BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__))) 18 19 20# Quick-start development settings - unsuitable for production 21# See https://docs.djangoproject.com/en/2.2/howto/deployment/checklist/ 22 23# SECURITY WARNING: keep the secret key used in production secret! 24SECRET_KEY = '2w$d67c)41^-4#9u_2x#m#-46a-@9qx9+y2xq8otj@i()yeoip' 25 26# SECURITY WARNING: don't run with debug turned on in production! 27DEBUG = True 28 29ALLOWED_HOSTS = [] 30 31 32# Application definition 33 34INSTALLED_APPS = [ 35 'django.contrib.admin', 36 'django.contrib.auth', 37 'django.contrib.contenttypes', 38 'django.contrib.sessions', 39 'django.contrib.messages', 40 'django.contrib.staticfiles', 41 'widget_tweaks', 42 'app', 43 'accounts', 44 'django.contrib.sites', 45 'allauth', 46 'allauth.account', 47 'allauth.socialaccount' 48] 49 50MIDDLEWARE = [ 51 'django.middleware.security.SecurityMiddleware', 52 'django.contrib.sessions.middleware.SessionMiddleware', 53 'django.middleware.common.CommonMiddleware', 54 'django.middleware.csrf.CsrfViewMiddleware', 55 'django.contrib.auth.middleware.AuthenticationMiddleware', 56 'django.contrib.messages.middleware.MessageMiddleware', 57 'django.middleware.clickjacking.XFrameOptionsMiddleware', 58] 59 60ROOT_URLCONF = 'mysite.urls' 61 62TEMPLATES = [ 63 { 64 'BACKEND': 'django.template.backends.django.DjangoTemplates', 65 'DIRS': [], 66 'APP_DIRS': True, 67 'OPTIONS': { 68 'context_processors': [ 69 'django.template.context_processors.debug', 70 'django.template.context_processors.request', 71 'django.contrib.auth.context_processors.auth', 72 'django.contrib.messages.context_processors.messages', 73 ], 74 }, 75 }, 76] 77 78WSGI_APPLICATION = 'mysite.wsgi.application' 79 80 81# Database 82# https://docs.djangoproject.com/en/2.2/ref/settings/#databases 83 84DATABASES = { 85 'default': { 86 'ENGINE': 'django.db.backends.sqlite3', 87 'NAME': os.path.join(BASE_DIR, 'db.sqlite3'), 88 } 89} 90 91 92# Password validation 93# https://docs.djangoproject.com/en/2.2/ref/settings/#auth-password-validators 94 95AUTH_PASSWORD_VALIDATORS = [ 96 { 97 'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator', 98 }, 99 { 100 'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator', 101 }, 102 { 103 'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator', 104 }, 105 { 106 'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator', 107 }, 108] 109 110 111# Internationalization 112# https://docs.djangoproject.com/en/2.2/topics/i18n/ 113 114LANGUAGE_CODE = 'ja' 115 116TIME_ZONE = 'Asia/Tokyo' 117 118USE_I18N = True 119 120USE_L10N = True 121 122USE_TZ = True 123 124 125# Static files (CSS, JavaScript, Images) 126# https://docs.djangoproject.com/en/2.2/howto/static-files/ 127 128STATIC_URL = '/static/' 129 130SITE_ID = 1 131LOGIN_REDIRECT_URL = '/' 132ACCOUNT_LOGOUT_REDIRECT_URL ='/' 133ACCOUNT_EMAIL_VERIFICATION = 'none'
試したこと
スーパーリロードをする。
ローカルサーバーを再起動する。
お手数ですが、完全にぬまにハマってしまっていますので、解決方法の程よろしくお願いします。
補足情報(FW/ツールのバージョンなど)
Django~=2.2.10
django-widget-tweaks~=1.4.8
django-allauth~=0.41.0
フォルダ構成をご提示ください。
accounts
│ ├── __init__.py
│ ├── __pycache__
│ │ ├── __init__.cpython-38.pyc
│ │ ├── admin.cpython-38.pyc
│ │ └── models.cpython-38.pyc
│ ├── admin.py
│ ├── apps.py
│ ├── migrations
│ │ ├── __init__.py
│ │ └── __pycache__
│ │ └── __init__.cpython-38.pyc
│ ├── models.py
│ ├── templates
│ │ └── accounts
│ │ ├── login.html
│ │ └── logout.html
│ ├── tests.py
│ ├── urls.py
│ └── views.py
├── app
│ ├── __init__.py
│ ├── __pycache__
│ │ ├── __init__.cpython-38.pyc
│ │ ├── admin.cpython-38.pyc
│ │ ├── forms.cpython-38.pyc
│ │ ├── models.cpython-38.pyc
│ │ ├── urls.cpython-38.pyc
│ │ └── views.cpython-38.pyc
│ ├── admin.py
│ ├── apps.py
│ ├── forms.py
│ ├── migrations
│ │ ├── 0001_initial.py
│ │ ├── __init__.py
│ │ └── __pycache__
│ │ ├── 0001_initial.cpython-38.pyc
│ │ └── __init__.cpython-38.pyc
│ ├── models.py
│ ├── static
│ │ └── css
│ │ └── style.css
│ ├── templates
│ │ └── app
│ │ ├── base.html
│ │ ├── index.html
│ │ ├── post_delete.html
│ │ ├── post_detail.html
│ │ └── post_form.html
│ ├── tests.py
│ ├── urls.py
│ └── views.py
├── db.sqlite3
├── manage.py
├── mysite
│ ├── __init__.py
│ ├── __pycache__
│ │ ├── __init__.cpython-38.pyc
│ │ ├── settings.cpython-38.pyc
│ │ ├── urls.cpython-38.pyc
│ │ └── wsgi.cpython-38.pyc
│ ├── settings.py
│ ├── urls.py
│ └── wsgi.py
フォルダ構成はこの様な感じです
style.css は /static/css/ にあるということですよね。正しいように見えますね……
返信遅くなって申し訳ありません。
確かにstyle.cssは/static/cssにあります。
cssはappのファイルの方では反映されているのですが、accountsの方のファイルには反映されていないという状況です。
ファイルが違うとcssは反映されないのですか?
それはルーティングが別になっているように思えます。
わかりました。
ただ、CSSはappの方では反映されているので、なぜ反映されない部分が出るのかがわからないです
ルートが異なるからではないでしょうか。
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
となっているので、app と mysite は別アプリの設定ではないですか?
あ、いや、違いますね。間違えました。
あなたの回答
tips
プレビュー