在 jinja2 模板上使用 css 样式表

Question

我正在使用 html、css、flask 和 jinja2 制作一个网站。

我有一个在烧瓶服务器上工作的页面，显示了按钮和标签等，但我没有加载我拥有的 css 样式表。

我如何将样式表链接到 jinja2 模板。我在互联网上四处张望，但找不到方法。

这是 css 样式表链接；我应该更改它还是 python 代码？

<link rel="stylesheet" type="text/css" href="styles.css">

这是我的烧瓶代码：

 @app.route('/')
def resultstemplate():
    return render_template('questions.html', head='Welcome!')

以下是文件的位置：

/python-code.py /templates/template.html /templates/styles.css

原文由 ptolemy0 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

所有公共文件（未处理的文件，如模板或 python 文件）都应放在专用的静态文件夹中。默认情况下，Jinja2 有一个名为 static 的静态文件夹。

这应该可以解决您的问题：

1. 移动 /templates/styles.css 到 /static/styles.css

2. 使用以下代码更新您的代码，这些代码将被翻译成正确的文件位置：

    <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">

有关 Jinja2 中静态文件的更多信息，请参见 此处。

原文由 Andrejs Cainikovs 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

<link rel="stylesheet" type="text/css" href="styles.css">

href 值必须在引号内。

确保文件名和路径正确或尝试以下

<link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}"/>

原文由 Sunil B N 发布，翻译遵循 CC BY-SA 3.0 许可协议