Flask アプリケーションが外部 CSS ファイルを認識しないのはなぜですか?

CSS ファイルが Flask アプリケーションで認識されない: ファイル構造のトラブルシューティング

Flask で外部 CSS ファイルを使用してテンプレートをスタイルしようとすると、ファイル構造が正しいことを確認するために不可欠です。スタイルが適用されない場合は、次の点を考慮してください:

ファイル構造:

/app
  - app_runner.py
  /services
    - app.py
  /templates
    - mainpage.html
  /styles
    - mainpage.css

HTMLマークアップ:

  
    <link rel="stylesheet" type="text/css" href="../styles/mainpage.css">
  
  
    <!-- content -->
  

問題:

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="%7B%7B%20url_for('static',%20filename='styles/mainpage.css')%20%7D%7D">

説明:

Flask は「static」フォルダーの下で静的ファイルを検索するため、ファイルを管理せずに CSS ファイルを提供できるようになります。パスを明示的に指定します。このアプローチを使用すると、アプリケーションは外部の「mainpage.css」ファイルで定義されたスタイルを正しく適用できるようになります。

以上がFlask アプリケーションが外部 CSS ファイルを認識しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。