zoukankan      html  css  js  c++  java
  • Flask block继承和include包含

    继承(Block)的本质是代码替换,继承我认为就是把完整的html文件继承到一个不完整的html文件里。

    被继承html文件:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>主模板</title>
    </head>
    <body>
        
        {# 模板继承使用block关键字 #}
        {% block top %}
        这里是导航栏
        {% endblock top %}
        
        {% block content %}
        需要被继承的内容,在这里填充
        {% endblock content %}
    </body>
    </html>

    继承html文件:

    {# 继承模板使用extends关键字 #}
    {% extends "day3_base.html" %}
    {% block content %}
    123123456789
    {% endblock content %}

    包含(include)是直接将目标模板文件整个渲染出来,包含就是和继承相反。

    等待被包含的html文件:

    <!-- 头部文件,只定义局部内容-->
    
    <div>
        这里是头部,可以被包含的
    </div>

    调用等待被包含的文件:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>模板包含学习</title>
    </head>
    <body>
        <!--使用include关键字,来包含之前定义好的模板-->
        {% include 'day3_top.html' %}
        <div>
            <div>{{contect}}</div>
            身体
        </div>
    </body>
    </html>
  • 相关阅读:
    使用Dockerfile构建镜像并push到私有仓库
    docker registry-v2 搭建私有仓库
    spring-cloud 学习四 服务网关
    spring-cloud 学习三 服务提供者
    TortoiseSVN安装和使用
    SG-UAP常用注解介绍
    weblogic漏洞
    开发工具历史版本
    Android Studio 打包生成apk
    weblogic unable to get file lock问题
  • 原文地址:https://www.cnblogs.com/Niuxingyu/p/10169756.html
Copyright © 2011-2022 走看看