DJango 获取静态引导样式表以应用于视图

Question

我对此感到摸不着头脑，因为这些都没有意义。

我正在开发模式下运行 Django 项目。

我有一个 base.html，我的许多页面中都包含它。

这是我的文件结构：

这是简单的base.html代码：

<!doctype html>
<html lang="en">

<head>
  <!-- Required meta tags -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

  <!-- Bootstrap CSS-->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">


  <title>RAHQ Locations {% block head_title %} {% endblock %}</title>
</head>

<body style="background-color: #26272b; color: #fff">
  {% include 'navbar.html' %}
  <div class='container-fluid'>
    {% block content %}

    {% endblock %}
  </div>
  {% include 'js.html' %}

  <br>
  <br>
  {% include 'footer.html' %}
</body>

</html>

一切都像这样完美运行。但我想更改 bootstrap css，所以我下载了 bootstrap css 文件，将其重命名为 styles.css，并将其放在我的静态文件夹中。

所以我用一切可以访问我的静态 styles.css 的内容替换 bootstrap href

我遵循所有在线指南，这些指南告诉我调整 settings.py 和 url.py 以允许使用静态文件。

我尝试从 view.py 引入路径：

url = staticfiles_storage.path('styles.css')

我什至尝试过手动将整个路径输入到 href (C:/Try-Django-2.2-master/src/static/styles.css)

我几乎尝试了你能想到的任何东西，但我无法加载样式。我做错了什么！？

如果我将CSS文件的实际路径放入浏览器中，我可以看到所有CSS......所以我在这里不知所措：

C:/Try-Django-2.2-master/src/static/styles.css

这是我的设置.py：

import os

BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
DEBUG = True
ALLOWED_HOSTS = ['54.245.181.209', '*']
LOGIN_URL = '/login'

INSTALLED_APPS = [ # components
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'locationSearch',

]

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',
]

ROOT_URLCONF = 'try_django.urls'

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates')],
        '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 = 'try_django.wsgi.application'


DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.sqlite3',
        'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
    }
}

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',
    },
]

LANGUAGE_CODE = 'en-us'

TIME_ZONE = 'UTC'

USE_I18N = True

USE_L10N = True

USE_TZ = True

STATIC_ROOT = os.path.join(os.path.dirname(BASE_DIR), 'src/static')
STATIC_URL = 'src/static/'

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "src/static"),
]

MEDIA_ROOT = os.path.join(os.path.dirname(BASE_DIR), 'src/media')
MEDIA_URL = 'src/media/'  # django-storages

Answer 1

您需要对代码进行一些更改。

请考虑更改您的 settings.py，然后更改 CSS 的 href 链接。

我们开始...

设置.py

STATICFILES_DIRS = [
    os.path.join(BASE_DIR,'src'),
]

CSS 的链接应该是这样的：

基本模板链接

<link type="text/css" rel="stylesheet" href="{% static 'css/main.css' %}" media="screen,projection" />

希望对您有用！

DJango 获取静态引导样式表以应用于视图

问题描述投票：0回答：1

1个回答

设置.py

基本模板链接

最新问题

DJango 获取静态引导样式表以应用于视图

问题描述 投票：0回答：1

1个回答

设置.py

基本模板链接

最新问题

问题描述投票：0回答：1