ホームページ >ウェブフロントエンド >CSSチュートリアル >Flask アプリケーションが外部 CSS ファイルを認識しないのはなぜですか?
Flask アプリケーションが外部 CSS ファイルを認識しないのはなぜですか?
- Patricia Arquetteオリジナル
- 2024-12-08 20:40:11810ブラウズ
CSS ファイルが Flask アプリケーションで認識されない: ファイル構造のトラブルシューティング
Flask で外部 CSS ファイルを使用してテンプレートをスタイルしようとすると、ファイル構造が正しいことを確認するために不可欠です。スタイルが適用されない場合は、次の点を考慮してください:
ファイル構造:
/app
- app_runner.py
/services
- app.py
/templates
- mainpage.html
/styles
- mainpage.css
HTMLマークアップ:
<html>
<head>
<link rel="stylesheet" type="text/css" href="../styles/mainpage.css">
</head>
<body>
<!-- content -->
</body>
</html>
問題:
CSS ファイルは、Flask が CSS などの静的ファイルを提供するために使用する「静的」フォルダーの外にあります。そしてJavaScript.
解決策:
これを解決するには、CSS ファイルを「static」フォルダーに移動し、HTML ファイルを更新します。したがって:
/app
- app_runner.py
/services
- app.py
/templates
- mainpage.html
/static
/styles
- mainpage.css
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles/mainpage.css') }}">
説明:
Flask は「static」フォルダーの下で静的ファイルを検索するため、ファイルを管理せずに CSS ファイルを提供できるようになります。パスを明示的に指定します。このアプローチを使用すると、アプリケーションは外部の「mainpage.css」ファイルで定義されたスタイルを正しく適用できるようになります。
以上がFlask アプリケーションが外部 CSS ファイルを認識しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。