Question

我对HTML和CSS非常陌生。我正在尝试将CSS和JS文件链接到HTML文件，但是它不起作用。我已经看过许多其他有关此问题的Stack Overflow问题和答案，但这些解决方案似乎都无效。我有什么错别字/问题吗？

    website
    |home
        |_static
            |_home
                |_styles.css
                |_main.js
        |_templates
            |_home
                |_base.html

这是我的base.html文件的顶部

  <head>
        {% load static %}
        <link rel="stylesheet" href="{% static '../home/styles.css' %}">
        <script src="{% static 'home/main.js' %}"></script>
        <link href="https://fonts.googleapis.com/css?family=Poppins&display=swap" rel="stylesheet">
        <meta charset="UTF-8">
        <title>Title</title>
    </head>

这是设置中的相关代码：

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

及以后的

STATIC_URL = '/static/'

以下是命令提示符中的错误消息：

[05/Jun/2019 13:58:15] "GET /home/ HTTP/1.1" 200 1014
Not Found: /home/styles.css
[05/Jun/2019 13:58:15] "GET /static/home/main.js HTTP/1.1" 404 1660
[05/Jun/2019 13:58:15] "GET /home/styles.css HTTP/1.1" 404 2304

Answer 1

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

如果这是您已安装的整个应用程序，则好像您尚未安装自己的应用程序，这意味着staticfiles应用程序不会检查该目录，因为它不是已安装的应用程序。在此处添加您的应用程序会将其添加到搜索的路径和django-dev-server将提供静态信息。

Answer 2

像这样更改您的../：

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

HTML未应用CSS

2 个答案: