首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Django:无法加载/static中的CSS文件

Django:无法加载/static中的CSS文件
EN

Stack Overflow用户
提问于 2019-04-16 13:41:00
回答 3查看 4.1K关注 0票数 1

自从我完成了Django网站的后端之后,我就开始添加一些样式。我的html文件显示,但似乎没有css链接到他们,但路径是正确的,当我显示源代码在火狐。

代码语言:javascript
运行
复制
mywebsite/
----blog/
----mywebsite/
----static/
--------css/
------------struct.css
----templates/
--------layouts/
--------errors/
------------404.html
--------html/
------------struct.html

Django版本:2.1.7

settings.py:

代码语言:javascript
运行
复制
DEBUG = False
ALLOWED_HOSTS = ['*']

INSTALLED_APPS = [
    # other apps...
    'django.contrib.staticfiles',
]

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

urls.py:

代码语言:javascript
运行
复制
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    # ...
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

struct.html:

代码语言:javascript
运行
复制
{% load static %}

<!DOCTYPE html>
<html lang="en" dir="ltr">

  <head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width; initial-scale=1.0;">

    <link rel="stylesheet" href="{% static 'css/struct.css' %}">

    <title>test</title>

  </head>

  <body>

    <p>test</p>


  </body>

</html>

struct.css:

代码语言:javascript
运行
复制
p{
    color:red:
}
body{
    background-color:black:
}
EN

回答 3

Stack Overflow用户

发布于 2019-04-16 14:52:37

通常,静态文件路径应该像这个appname/静态/appname/ url文件一样,不需要更改url模式。

假设您的appname是Myapp,css文件的正确路径是

Myapp/static/Myapp/css/struct.css

若要包含静态文件,请在settings.py中添加以下行

代码语言:javascript
运行
复制
STATIC_URL = '/static/'

在html模板中

代码语言:javascript
运行
复制
<!doctype html>
{% load static %}
<link rel="stylesheet" href="{% static 'Myapp/css/struct.css' %}">

如果您在应用程序中有静态文件,则不需要使用

代码语言:javascript
运行
复制
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "static"),
]

您可以在django文档中引用管理静态文件

票数 2
EN

Stack Overflow用户

发布于 2019-04-16 13:50:19

中定义静态根

代码语言:javascript
运行
复制
STATIC_ROOT = BASE_DIR + '/static/'

希望它能帮上忙

参考

票数 0
EN

Stack Overflow用户

发布于 2022-03-05 14:10:29

如果您在localhost上运行此应用程序,那么如果您错误地将其设置为False,则可以尝试将DEBUG = True设置为False,因为它是为我修复的。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/55709626

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档