CSSをhtmlファイルにリンクするPycharm 404

-1

私はHTMLファイルにCSSファイルをリンクしようとしていますが、まだ404エラーが発生しています。パスを変更するために設定や何かに行かなければならないかどうかはわかりませんが、誰にも洞察力はありますか？私はさまざまなディレクトリに物事を移動しようとしましたが、運はありません。私はこのエラーを取得しておいてください。CSSをhtmlファイルにリンクするPycharm 404

[04/11月/ 2017年11時14分04秒] "GET /templates/css/style.css HTTP/1.1" 404 -

main.py：

from flask import Flask 
from flask_sqlalchemy import SQLAlchemy 
from flask import render_template, url_for, redirect, request 


app = Flask(__name__) 
app.config['SQLALCHEMY_DATABASE_URI'] = 
'postgresql://[email protected]/flaskmovie' 
db = SQLAlchemy(app) 


class User(db.Model): 
    id = db.Column(db.Integer, primary_key=True) 
    username = db.Column(db.String(80), unique=True) 
    email = db.Column(db.String(140), unique=True) 

def __init__(self, username,email): 
    self.username = username 
    self.email = email 


def __repr__(self): 
    return '<User %r>' % self.username 


@app.route('/index2') 
def index2(): 
    return render_template('index2.html') 


@app.route('/') 
def index(): 
    return render_template('add_user.html') 


@app.route('/post_user', methods=['POST']) 
def post_user(): 
    user = User(request.form['username'], request.form['email']) 
    db.session.add(user) 
    db.session.commit() 
    return redirect(url_for('index')) 


if __name__ == '__main__': 
    app.run()

HTMLファイル：

<!DOCTYPE html> 
<html > 
<head> 
    <meta charset="UTF-8"> 
    <title>A Pen by User</title> 
    <link rel="stylesheet" href="templates/css/style.css"> 
</head> 

<body> 

<form> 
    <header>Login</header> 
    <label>Username <span>*</span></label> 
    <input/> 
    <div class="help">At least 6 character</div> 
    <label>Password <span>*</span></label> 
    <input/> 
    <div class="help">Use upper and lowercase lettes as well</div> 
    <button>Login</button> 
</form> 


</body> 
</html>

CSSファイル：

html, body { 
    border: 0; 
    padding: 0; 
    margin: 0; 
    height: 100%; 
} 

body { 
    background: tomato; 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    font-size: 16px; 
} 

form { 
    background: white; 
    width: 40%; 
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.7); 
    font-family: lato; 
    position: relative; 
    color: #333; 
    border-radius: 10px; 
} 
form header { 
    background: #FF3838; 
    padding: 30px 20px; 
    color: white; 
    font-size: 1.2em; 
    font-weight: 600; 
    border-radius: 10px 10px 0 0; 
} 
form label { 
    margin-left: 20px; 
    display: inline-block; 
    margin-top: 30px; 
    margin-bottom: 5px; 
    position: relative; 
} 
form label span { 
    color: #FF3838; 
    font-size: 2em; 
    position: absolute; 
    left: 2.3em; 
    top: -10px; 
} 
form input { 
    display: block; 
    width: 78%; 
    margin-left: 20px; 
    padding: 5px 20px; 
    font-size: 1em; 
    border-radius: 3px; 
    outline: none; 
    border: 1px solid #ccc; 
} 
form .help { 
    margin-left: 20px; 
    font-size: 0.8em; 
    color: #777; 
} 
form button { 
    position: relative; 
    margin-top: 30px; 
    margin-bottom: 30px; 
    left: 50%; 
    transform: translate(-50%, 0); 
    font-family: inherit; 
    color: white; 
    background: #FF3838; 
    outline: none; 
    border: none; 
    padding: 5px 15px; 
    font-size: 1.3em; 
    font-weight: 400; 
    border-radius: 3px; 
    box-shadow: 0px 0px 10px rgba(51, 51, 51, 0.4); 
    cursor: pointer; 
    transition: all 0.15s ease-in-out; 
} 
form button:hover { 
    background: #ff5252; 
}

ディレクトリ階層：