Question

我已经搜索了一个拼写错误并尝试了我在这个网站上找到的几个修复程序，但我的样式仍未应用。目录结构如下：

ResumeSite
----/static
--------/img
------------img1.jpg
------------img2.jpg
--------style.css
----/templates
--------index.html
app.py

CSS文件如下：

/* CSS Variables */

:root {
    --primary: #ddd;
    --dark: #333;
    --light: #fff;
    --shadow: 0 1px 5x rgba(104, 104, 104, 0.8);
}

html {
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
    color: var(--dark);
}

body {
    background: #ccc;
    margin: 30px 50px;
    line-height: 1.4;
}

.btn {
    background-color: var(--dark);
    color: var(--light);
    padding: 0.6rem 1.3rem;
    text-decoration: none;

}

.showcase h1 {
    color: red;
}

在index.html文件中，我将样式表与Jinja语法正确链接：

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

我现在还不确定问题是什么，当我运行服务器时，我收到一条命令行消息，指出：

GET HTTP:1 200 -

我相信200意味着成功，但无论我到目前为止尝试过什么风格都没有应用。

Answer 1

我无法从您发布的代码中了解到，但如果您使用的是Boostrap，请确保在引用style.css后提及bootstrap.css文件

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

否则，您的更改将被默认引导样式

覆盖

Answer 2

问题只是CSS文件位于静态目录的顶层而不是名为'css'的子文件夹中。感谢@Manish Mahendru提到这一点，我将来必须提醒自己烧瓶应用的正确结构。

Flask没有读取CSS文件

2 个答案: