FlaskでCSSファイルを読み込む方法

静的フォルダの作成: まず、Flaskのアプリケーションフォルダ内に「static」という名前のフォルダを作成します。このフォルダは、静的なファイル（CSSやJavaScriptなど）を格納するためのものです。
CSSファイルの配置: 作成した「static」フォルダ内にCSSファイルを配置します。例えば、CSSファイルを「static/styles.css」というパスに配置する場合、フォルダ構造は以下のようになります:

your_app_folder/
    static/
        styles.css
    your_app.py

テンプレートでCSSファイルを読み込む: Flaskのテンプレートエンジンを使用して、CSSファイルをHTMLテンプレートに読み込むことができます。以下の例では、<link>要素を使用してCSSファイルを読み込んでいます。

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css') }}">
</head>
<body>
    <!-- ここにHTMLコンテンツを記述 -->
</body>
</html>

href属性の値で、url_for関数を使用してCSSファイルのパスを指定しています。url_for関数は、指定したファイルのURLを生成するために使用されます。

以上の手順に従うと、FlaskアプリケーションでCSSファイルを読み込むことができます。これにより、テンプレート内で定義したスタイルが適用され、ウェブページの外観をカスタマイズすることができます。

この方法を使えば、Flaskを使用したWebアプリケーションでCSSを効果的に管理できます。必要に応じて、追加のCSSファイルやリソースを同じ手順で追加することもできます。