Q&A
pythonというのはDjangoか何か使ってるんでしょうか？
前提
htmlとpythonとcssを使って簡単な掲示板を作っています。
初心者です。
発生している問題
cssとリンクさせるため、htmlの<head></head>の中に<link rel="stylesheet" href="../static/style.css">と
書いたのですがそれが無視されてしまいます。
cssファイルの場所は、htmlが入っているフォルダと同じ階層のstaticフォルダです。
該当のソースコード
index.html
1<!--DOCTYPE html--> 2<html lang="ja"> 3<meta charset="utf-8"> 4<head> 5 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 6 <title>簡易掲示板</title> 7<link rel="stylesheet" href="../static/style.css"> 8</head> 9<body> 10 <h1>【掲示板】</h1> 11 <form action="/result" method="post"> 12 <input type="hidden" name="comment_box"> 13 <label for="comment_">投稿</label> 14 <textarea name="comment_data" rows="6" cols="50"></textarea> 15 <p></p> 16 <button type="submit">送信する</button> 17 </form> 18 <h2>【投稿一覧】</h2> 19 20 <form method="post" action=""> 21 <table> 22 <thead class="thead-dark"> 23 <tr> 24 <th>投稿内容</th> 25 </tr> 26 </thead> 27 <tbody> 28 {% for th in lines %} 29 <tr> 30 <td>{{ th.comment }}</td> 31 </tr> 32 {% endfor %} 33 </tbody> 34 </table> 35 </form> 36 37 <p></p> 38</body> 39</html> 40
style.css
1body { 2 background-color: wheat; 3} 4p{font-size:20px; 5color:red;} 6suku { 7 8 width: 100px; 9 10 height: 50px; 11 12 overflow: scroll; 13 14 border: blue 5px solid; 15 16} 17
試したこと
ファイルのパスを変えてみましたがダメでした。
flaskを使っています。
https://qiita.com/gsacademy_tokyo/items/16cba215a0cd921df87f#スタティックファイル
このURLのようにフォルダ位置を合わせた場合同様のCSSパスを指定すればできるかと思います
ファイルのパスもそのサイトにあわせましたができませんでした
それどころか、画像ファイルの参照もできなくなりました。
まだ質問が「受付中」になっていますが、「ベストアンサー」を選び「解決済」にされてはいかがでしょうか。
回答1件
0
ベストアンサー
Flaskを使っているのですよね。
HTMLテンプレートをtemplatesフォルダーに、CSSファイルをstaticフォルダーに配置しているのだと推測します。
この、配置しているフォルダー構造のままCSSファイルのパスを設定してはいけません。実際に生成されるHTMLファイルはtemplatesフォルダーではなく、別の場所に作られるからです。
では、どうやってCSSファイルのパスを設定するかというと、static直下にstyle.cssを置いてあるなら、
HTML
1<link rel="stylesheet" href="{{url_for('static', filename='style.css')}}">
のように、url_forを使って書きます。これで、HTMLテンプレートから生成されるHTMLファイルの場所を気にすることなく、アクセス可能な形でCSSファイルへの相対パスをFlaskが生成してくれます。
投稿2020/10/29 14:48
総合スコア11990
あなたの回答
tips
プレビュー
