无法将 CSS 文件集成到我的项目中

Couldn't integrate a CSS file into my project

我想将我的 layout.html 文件与 CSS 文件连接起来,以便每隔一页扩展我的 layout.html 有权访问此 CSS 文件。

也就是代码:

layout.html

<!DOCTYPE html>
<html lang="de">
    <head>
        <title>Aufgabenzettel</title>
        <link rel="stylesheet" href="/aufgabenzettel/static/css/main.css">
    </head>
    <body>
        {% block body %}
        {% endblock %}
    </body>

</html>

index.html

{% extends "aufgabenzettel/layout.html" %}

{% block body %}
    <h1>Meine Aufgaben</h1>
{% endblock %}

main.css

h1 {
    color: aqua;
}

layout.html 中的 href 可能是正确的,因为我可以通过 ctrl + 单击在 VS 中重定向到它。但是,index.html 中的 h1 仍然显示为黑色而不是浅绿色... 我做错了什么?

我感谢所有的帮助!

首先你必须在你的代码顶部添加 {% load static %} 在你想在模板中使用 static 函数的地方,然后你必须使用这样的静态函数 {% static 'your_css_path_inside_static_directory' %} 例如.

{% load static %}
<!DOCTYPE html>
<html lang="de">
    <head>
        <title>Aufgabenzettel</title>
        <link rel="stylesheet" href="{% static '/aufgabenzettel/static/css/main.css' %}">
    </head>
    <body>
        {% block body %}
        {% endblock %}
    </body>

</html>