python - Flask 中的 CSS 文件出现 404 错误

标签 python html css flask

我正在尝试在基于 Flask 的网站上设置某些元素的样式,但由于某种原因我的 css 文件从未加载。

不过情况很特殊;当从 layout.html 使用路径 /static/css/ 调用时,文件将正常加载,但由于某种原因,页面会截断 /css/的路径 第二次并生成 404 错误。

这是我的 Flask 元素的结构:

Directory Structure:

+app
+static
    +css
        style-large.css
        style.css
        style-xlarge.css
+templates
    index.html
    layout.html

layout.html 的片段:

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block doc_title %} {% endblock %}</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]-->
    <script src="{{ url_for('static', filename='js/jquery.min.js') }}"></script>
    <script src="{{ url_for('static', filename='js/skel.min.js') }}"></script>
    <script src="{{ url_for('static', filename='js/skel-layers.min.js') }}"></script>
    <script src="{{ url_for('static', filename='js/init.js') }}"></script>


    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/skel.css') }}" />
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/style.css') }}" />
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/style-xlarge.css') }}" />
    <!-- <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}" /> -->
    <!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]-->
</head>

特殊性是这里。无论我如何更改文件 steyl-large.cssstyle.cssstyle-xlarge.css 的 url,我总是收到如下所示的 404 错误:

127.0.0.1 - - [05/Dec/2015 17:34:20] "GET /static/css/style-xlarge.css HTTP/1.1" 304 -
127.0.0.1 - - [05/Dec/2015 17:34:20] "GET /static/css/style.css HTTP/1.1" 304 -
127.0.0.1 - - [05/Dec/2015 17:34:20] "GET /css/style-large.css HTTP/1.1" 404 -
127.0.0.1 - - [05/Dec/2015 17:34:20] "GET /css/style.css HTTP/1.1" 404 -
127.0.0.1 - - [05/Dec/2015 17:34:20] "GET /css/style-xlarge.css HTTP/1.1" 404 -

前两个请求(生成 304 代码的请求)可以正常工作并呈现我页面上的几乎所有内容,但紧随其后的请求却不能。

我不确定为什么会发生这种情况。我认为这可能是我页面上的元素没有设置样式的原因,但我不知道为什么会发生这种情况。

最佳答案

因此,从您的服务器日志中,前两个链接指向 css 文件

<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/skel.css') }}" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/style.css') }}" />

正常工作,正如它们应该的那样。在第三个链接中

<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/style-xlarge.css') }}" />

您的 css 文件名为 style-xlarge.css,但在服务器日志中是 style-large.css。您没有 style-large.css 的链接。 要加载所有四个 css 文件,您应该使用

<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/skel.css') }}" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/style.css') }}" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/style-large.css') }}" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/style-xlarge.css') }}" />

关于python - Flask 中的 CSS 文件出现 404 错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34111859/

相关文章:

python - 在 tkinter 文件对话框中指定文件路径

html - 如何在 Go 服务器上运行 html

html - 两种不同浏览器上的两种不同宽度

html - 将全宽固定标题与主要内容对齐?

python - 在列表列表中搜索一列的最大数字

python - 如何在 Python 的同一行上打印变量和字符串?

html - float CSS元素的问题

html - 仅使用 CSS 切换 Accordion 字形图标

python - 将不同长度的列添加到 Pandas 数据框中

html - Bootstrap 表单中的阵容标签和复选框