我正在渲染一个模板,尝试使用外部样式表进行样式设置。文件结构如下。
/app - app_runner.py /services - app.py /templates - mainpage.html /styles - mainpage.css
mainpage.html看起来像这样
<html> <head> <link rel= "stylesheet" type= "text/css" href= "../styles/mainpage.css"> </head> <body> <!-- content -->
我的样式均未应用。它与html是我正在渲染的模板有关吗?python看起来像这样。
return render_template("mainpage.html", variables..)
我知道这很有效,因为我仍然能够渲染模板。但是,当我尝试将样式代码从html的“ head”标记中的“样式”块移动到外部文件时,所有样式消失了,仅留下了一个html页面。有人看到我的文件结构有任何错误吗?
你需要有一个“静态”文件夹设置(用于css / js文件),除非你在Flask初始化期间专门覆盖了它。我假设你没有覆盖它。
你的CSS目录结构应类似于:
/app - app_runner.py /services - app.py /templates - mainpage.html /static /styles - mainpage.css
-
请注意,你的/ styles目录应位于/ static下
然后做
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='styles/mainpage.css') }}">
Flask现在将在static / styles / mainpage.css下查找css文件