在jinja2模板上使用CSS样式表 [英] use a css stylesheet on a jinja2 template

问题描述

我正在使用html，css，flask和jinja2建立一个网站.

I am making a website using html, css, flask and jinja2.

我在Flask服务器上有一个工作页面，显示了按钮和标签等，但是我没有加载CSS样式表.

I have a page working on a flask server, the buttons and labels etc. are displayed, but the css stylesheet I have is not loaded in.

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

How would I link a stylesheet to a jinja2 template. I have looked around on the internet but cannot find out how.

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

Here is the css stylesheet link; should I change this, or the python code?

<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

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

推荐答案

所有公共文件(未处理的文件，例如模板或py​​thon文件)应放置在专用的静态文件夹中.默认情况下，Jinja2具有一个名为static的静态文件夹.

All public files (the ones that are not processed, like templates or python files) should be placed into dedicated static folders. By default, Jinja2 has one static folder called static.

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

This should fix your problem:

1. 将/templates/styles.css移至/static/styles.css

使用以下代码更新您的代码，该代码将转换为正确的文件位置:

Update your code with following code, that will be translated into correct file location:

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

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

More info on static files in Jinja2 is here.

这篇关于在jinja2模板上使用CSS样式表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！