Flask 之 jinja2 魔板继承 引入静态资源 

# app.py


from flask import Flask, render_template



app = Flask(__name__)

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


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

if __name__ == '__main__':
    app.run(debug=True)
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>
        user -- {% block title %}
                {%  endblock  %}
    </title>
</head>
<body>
<div>
    {% block header %}
     {%  endblock %}
    <hr>
</div>

<div>
     {% block body %}
     {%  endblock %}
    <hr>
</div>


<div>
    2020 year <a href="">关于我们</a>
</div>
</body>
</html>
/template/bash.html
{% extends 'bash.html' %}
{% block title %}
用户登录
{%  endblock %}

{% block header %}
    用户登录
 {%  endblock %}
  {% block body %}
    <table>
        <tbody>
            <tr>
                <td>用户：id</td>
                <td><input type="text"></td>
            </tr>
            <tr>
                <td>密码：id</td>
                <td><input type="password"></td>
            </tr>
        <tr align="center">
            <td colspan="2">
                <button type="submit">确定</button>
                <button type="reset">取消</button>
            </td>
        </tr>
        </tbody>
    </table>
 {%  endblock %}
/template/login.html
{% extends 'bash.html' %}
{% block title %}
用户注册
{%  endblock %}


{% block header %}
    用户注册
 {%  endblock %}

{% block body %}
        <table>
            <tbody>
                <tr>
                    <td>用户：</td>
                    <td><input type="text"></td>
                </tr>
                <tr>
                    <td>密码：id</td>
                    <td><input type="password"></td>
                </tr>
                <tr>
                    <td class="label">请再次输入密码：</td>
                    <td><input type="password"></td>
                </tr>
            <tr align="center">
                <td colspan="2">
                    <button type="submit">注册</button>
                    <button type="reset">取消</button>
                </td>
            </tr>
            </tbody>
        </table>

     {%  endblock %}
/template/register.html
/static/imgage
/static/js
/static/css

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- linke  是引入css-->
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/xx.css') }}">
    <link rel="stylesheet" type="text/css" href="/static/css/">
    <script type="text/javascript" src="{{ url_for('static', filename=js/xx.js)}}"></script>
</head>
<body>
<img src="{{ url_for('static',filename='imgage/xxx.jpg') }}" alt="">
</body>
</html>
/template/static.html

 

posted @ 2020-08-25 10:05  Handsome、Snake  阅读(248)  评论(0)  编辑  收藏  举报