web-dev-qa-db-ja.com

jinja2テンプレートでCSSスタイルシートを使用する

私はhtml、css、flaskおよびjinja2を使用してWebサイトを作成しています。

flaskサーバーで動作するページがあり、ボタンやラベルなどが表示されますが、持っているCSSスタイルシートは読み込まれていません。

スタイルシートをjinja2テンプレートにどのようにリンクしますか？私はインターネットを見回しましたが、どのように見つけることができません。

CSSスタイルシートのリンクは次のとおりです。これを変更する必要がありますか、pythonコード？

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

ここに私のflaskコード：

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

ファイルの場所は次のとおりです。

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

pythonhtmlcssflaskjinja2
27
ptolemy0

すべてのパブリックファイル（テンプレートやpythonファイル）などの処理されないファイル）は、専用の静的フォルダーに配置する必要があります。デフォルトでは、Jinja2にはstaticという静的フォルダーがあります。

これで問題が解決するはずです。

  1. 移動/templates/styles.cssから/static/styles.css

  2. 次のコードでコードを更新すると、正しいファイルの場所に変換されます。

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

Jinja2の静的ファイルの詳細は here です。

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

href値は引用符で囲む必要があります。

ファイル名とパスが適切であることを確認してくださいOR以下を試してください

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

ハンドラーの順序が問題を引き起こす可能性があります。

url: /stylesheets static_dir: stylesheets
url: /.* script: helloworld.application

代わりに動作します

url: /.* script: helloworld.application
url: /stylesheets static_dir: stylesheets
2
George Nguyen

ここで言われたことに追加するには、Jinja2をv2.10に更新してください。これより小さなバージョンでは、この同じバグが発生するようです。乾杯！

0
jaredgorski

Stack Overflowでほぼすべてのソリューションを試しました。 staticフォルダーをsameディレクトリーにrun.pyファイル。フォルダー構造を次から変更しました：

app/
    views
    static
    templates
run.py

に：

app/
    views
    templates
static
run.py

run.py代わりに機能します。追加情報については、こちらをご覧ください Jinja Templating Tutorial それが機能するために構造を変更しなければならなかった理由がわかりません。

0
wcyn