无法将 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>
我想将我的 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>