在chrome開發工具中找不到404錯誤CSS文件

Question

我花了一個半小時閱讀關於此問題的其他文章，但仍未解決。我相信該文件位於正確的位置，文件路徑參考是適當的。我在本地測試我的Web應用程序，嘗試對它進行一些設置，而Chrome開發工具則說這個CSS文件無法找到。我正在使用Python，Google App Engine和Jinja2。 Check out the error爲你自​​己，如果你想。預先感謝您的時間和專業知識！

這是我的HTML文件。第二個從第一個繼承。

base.html文件

​​3210

front.html

{% extends "base.html" %} 

{% block content %} 

    <br> 
    <br> 
    <a href="/dochore">Do Chore</a> 
    &nbsp; 
    <a href="/addchore"> + Add Chore</a> 
    &nbsp; 
    <a href="/removechore"> - Remove Chore</a> 
    &nbsp; 
    <a href="/choredetail">Chore Details</a> 
    <br> 
    <br> 
    <br> 

    {% for chore in chores %} 
    {{ chore.render() | safe }} 
    <br><br> 
    {% endfor %} 

{% endblock %} 

我的項目目錄的結構類似於...

project-name/ 
    main.py 
    templates/ 
    HTML files 
    static/ 
    style.css 

這裏是我的app.yaml。 ..

application: chorestimemadison 
version: 1 
runtime: python27 
api_version: 1 
threadsafe: yes 

handlers: 
- url: /favicon\.ico 
    static_files: favicon.ico 
    upload: favicon\.ico 

- url: .* 
    script: main.app 

libraries: 
- name: webapp2 
    version: "2.5.2" 
- name: jinja2 
    version: latest 

Answer 1

你缺少的處理程序靜態目錄：

handlers: 
- url: /favicon\.ico 
    static_files: favicon.ico 
    upload: favicon\.ico 
- url: /static 
    static_dir: static 
- url: .* 
    script: main.app 

Learn more about why this is necessary.

Answer 2

我打賭你對目錄訪問存在問題。如果您的HTML文件位於模板文件夾下，並且您的模板文件夾位置爲http://chorestimemadison.appspot.com/，那麼無論您使用何種URL，HTML文件都無法訪問靜態文件夾（或其中的CSS文件），因爲它們不是Web服務器的目錄結構。

你必須要麼：

1. 移動靜態文件夾放到模板文件夾。
2. 將Web服務器的根目錄更改爲項目名稱而不是模板，並將對style.css的引用更改爲../static/style.css。

Answer 3

當你的CSS和HTML文件在文件夾相同常需要首先後退1個目錄與「../」，然後輸入你的CSS路徑，像這樣

<link rel="stylesheet" href="../static/style.css" type="text/css" /> 

您所輸入的方式，它是尋找模板/靜態你的CSS，因爲tempalates是當前文件夾（其中HTML執行）