PythonのWebフレームワークであるFlaskでCSSを活用する方法について解説します。
FlaskとCSS
FlaskはPythonで書かれた軽量なWebフレームワークで、小規模から中規模のWebアプリケーション開発に適しています。一方、CSSはWebページのスタイルを制御するための言語で、HTMLと組み合わせて使われます。
FlaskでCSSを使うためには、特定のディレクトリ構造とファイル配置が必要です。
/
└ app.py
└ templates
└ index.html
└ static
└ css
└ style.css
この構造では、app.pyがFlaskアプリケーションのメインファイル、templatesディレクトリがHTMLファイルを格納する場所、そしてstaticディレクトリがCSSやJavaScriptなどの静的ファイルを格納する場所となります。
CSSの適用
CSSを適用するためには、HTMLファイルからCSSファイルを読み込む必要があります。以下に、index.htmlからstyle.cssを読み込む例を示します。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>My Flask App</title>
<link rel="stylesheet" href="/static/css/style.css">
</head>
<body>
<h1>Welcome to My Flask App</h1>
</body>
</html>
この例では、<link>タグを使ってstyle.cssを読み込んでいます。href属性の値/static/css/style.cssは、style.cssへのパスを指定しています。
以上が、PythonのFlaskでCSSを活用する基本的な方法です。この知識を使って、Flaskで作成したWebアプリケーションの見た目を自由にカスタマイズしてみてください。.