CSS is not being connected to HTML Flask-CodePudding

I'm writing a site for Flask and faced the problem that the css-file does not connect to the project

This is HTML-file

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css'>
<link type="text/css" href="{{url_for('static', filename='css/main.css')}}" rel="stylesheet" />

This is CSS-file:

body {
background: red;
}

But the color never appeared on the site

CodePudding user response：

What you should do is, if your static file is in templates file remove it from templates and do that:

from flask import Flask, render_template

css_file = "static/styles/style.css"
app = Flask(__name__)

@app.route("/")
def home():
   return render_template("index.html", css_link = css_file)

then in your head tag you add:

<link rel="stylesheet" href="{{css_link}}" type="text/css"/>

Don't forget to add a body tag!

CodePudding user response：

You need to add <body></body> to your html document