Question

我花了一个半小时阅读关于这个问题的其他帖子，但仍然没有解决它。我相信文件位于正确的位置，文件路径引用是合适的。我在本地测试我的Web应用程序尝试设置它的样式，chrome dev工具说无法找到CSS文件。我使用的是Python，Google App Engine和Jinja2。如果您愿意，可以Check out the error为自己。提前感谢您的时间和专业知识！

以下是我的HTML文件。第二个继承自第一个。

base.html

<!DOCTYPE html>
<html>
<head>

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

<body>
  <a href="/" class="main-title">
    Chores
  </a>

  <div id="content">
  {% block content %}
  {% endblock %}
  </div>
</body>

</html>

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服务器的目录结构。

你必须要么：

将静态文件夹移动到模板文件夹中。
将Web服务器的根目录更改为项目名称而不是模板，并将对style.css的引用更改为../static/style.css。

Answer 3

由于您的css和html文件位于paralel文件夹中，您首先需要使用＆＃34; ../"退回1个目录;然后输入你的css路径

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

你键入的方式，它在模板/静态中寻找你的css，因为tempalates是你当前的文件夹（html执行的地方）

Answer 4

使用“./”代替“/”。它有助于获取当前目录。在您的情况下，代码应该是：

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

在chrome dev工具中找不到404错误CSS文件

4 个答案: