前提・実現したいこと
flaskを用いて、webアプリケーションを作っています。その中でhtmlとcssでwebページを
作成しようと思っていますが、htmlにcssがうまくあたってくれません。
発生している問題・エラーメッセージ
問題:index.htmlにcssがあたらない。
下記ディレクト構成になっています。application.pyを実行することでwebサーバを立ち上げ、index.htmlの内容を描画します。app.pyはアプリロジックを記載しています。stylesheet.cssに記載したcssがindex.htmlに当たらず困っています。
application.py
app/
├ templates/
│ ├ index.html
│ └ stylesheet.css
└ app.py
該当のソースコード
index.htmlに記載されたcssを参照する部分のコードは下記です。
index.html
1・・・省略 2 3<head> 4 5・・・省略 6 7 8<link rel="stylesheet" href="./stylesheet.css"> 9 10 11・・・省略 12 13</head> 14 15・・・省略
試したこと
■ファイルを直接開いたときにはCSSがあたることを確認
下記ファイル構成のPC上のindex.htmlファイルを直接開くと(ローカルにwebサーバを立ち上げない場合は)、CSSの内容が反映されていました。そのため、webサーバを立ち上げたときのパスの指定に誤りがあるのではと思っています。
C:\Users***\workspace\teratail01\app\templates/
├ index.html
└ stylesheet.css
■index.htmlに記載する相対パスを色々変更
下記の記事をみるとブラウザでアクセスしたフォルダが起点(カレントディレクトリ)となると記載があったので、私の場合はapplication.pyが起点となるのではと思い色々相対パスを変更してみましたがどれもうまくいきませんでした。
https://nmp300.hatenablog.com/entry/2019/10/07/191232
index.html
1<link rel="stylesheet" href="app/templates/stylesheet.css">
index.html
1<link rel="stylesheet" href="templates/stylesheet.css">
補足情報(FW/ツールのバージョンなど)
python 3.8
あなたの回答
tips
プレビュー