应用程序未拾取.css文件（Flask/ python）

小编典典

应用程序未拾取.css文件（Flask/ python）

python

我正在渲染一个模板，尝试使用外部样式表进行样式设置。文件结构如下。

/app
    - app_runner.py
    /services
        - app.py 
    /templates
        - mainpage.html
    /styles
        - mainpage.css

mainpage.html看起来像这样

<html>
    <head>
        <link rel= "stylesheet" type= "text/css" href= "../styles/mainpage.css">
    </head>
    <body>
        <!-- content -->

我的样式均未应用。它与html是我正在渲染的模板有关吗？python看起来像这样。

return render_template("mainpage.html", variables..)

我知道这很有效，因为我仍然能够渲染模板。但是，当我尝试将样式代码从html的“
head”标记中的“样式”块移动到外部文件时，所有样式消失了，仅留下了一个html页面。有人看到我的文件结构有任何错误吗？

阅读 194

2020-12-20

共1个答案

小编典典

您需要有一个“静态”文件夹设置（用于css / js文件），除非您在Flask初始化期间专门覆盖了它。我假设您没有覆盖它。

您的css目录结构应类似于：

/app
    - app_runner.py
    /services
        - app.py 
    /templates
        - mainpage.html
    /static
        /styles
            - mainpage.css

请注意，您的/ styles目录应位于/ static下

然后做

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

Flask现在将在static / styles / mainpage.css下查找css文件

2020-12-20