Flask-模板继承和使用block

 //模板继承语法
 //作用:可以把一些公共的代码放到父模板中,避免每个模板写同样的代码
 {% extends 'base.html' %}
 //block实现:
 //作用:可以让子模板实现一些自己的需求。父模板需要提前定义好。
 	//注意:子模板中的代码,必须放在block块中

------------------------------------------

父模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}
    
    {% endblock %}</title>
    <style>
        .nav{
            background-color: #3a3a3a;
            height: 55px;
        }
        ul{
            overflow: hidden;
        }
        ul li{
            float: left;
            list-style: none;
            padding: 0 10px;
            line-height: 55px;
        }
        ul li a{
            color: #fff;
        }
    </style>
    {% block head %}
    
    {% endblock %}
</head>
<body>
<div class="nav">
    <ul>
        <li><a href="#">首页</a></li>
        <li><a href="#">问答</a></li>
    </ul>
</div>
{% block main %}{% endblock %}
</body>
</html>

子模板

{% extends 'base.html' %}
{% block head %}
    <style>
        h1{
            color: red;
        }
    </style>
{% endblock %}

{% block title %}首页{% endblock %}

{% block main %}
<h1>这是首页</h1>
{% endblock %}

猜你喜欢

转载自blog.csdn.net/qq_42991834/article/details/89515516