Flask静态CSS文件

问题描述 投票:0回答:1

我正在研究如何将烧瓶中的值添加到static / css文件中这是我来自static / style.css的代码:

.color1 {
    background-color: {{pickcolor}};
    width: 30px;
    height: 30px;
}

.color2 {
    background-color: {{pickcolor}};
    width: 30px;
    height: 30px;
}

所以我遇到的问题是下划线错误property value expectedcss(css-propertyvalueexpected)

但是当我在html文件中使用内部CSS时

<style>

    .color1 {
        background-color: {{pickcolor}};
        width: 30px;
        height: 30px;
    }

    .color2 {
        background-color: {{pickcolor}};
        width: 30px;
        height: 30px;
    }


</style>

我的{{pickcolor}}没有下划线问题

python html css flask
1个回答
0
投票

您的style.css文件可能不是templated。我不知道您的确切项目配置,但通常通常不会static文件作为模板。

如果要为CSS文件创建模板,请先将其移动到模板文件夹(通常为templates),然后必须为其创建视图并使用该视图的URL而不是指向静态文件的链接。 例如

from flask import make_response, render_template

@app.route('/style.css')
def style():
    pickcolor = ...  # whatever

    # we explicitly create the response because we need to edit its headers
    response = make_response(render_template('style.css', pickcolor=pickcolor))

    # required to make the browser know it is CSS
    response['Content-type'] = 'text/css'

    return response

然后,在您的HTML模板中

<html>
  <head>
    <link rel="stylesheet" type="text/css" href="{{ url_for('style') }}">
  </head>
  <!-- ... -->
</html>
© www.soinside.com 2019 - 2024. All rights reserved.