zoukankan      html  css  js  c++  java
  • 路飞学城Python-Day80

    36-模板语法之继承
    Django模版引擎中最强大也是最复杂的部分就是模版继承了。模版继承可以让您创建一个基本的“骨架”模版,它包含您站点中的全部元素,并且可以定义能够被子模版覆盖的 blocks 。
    通过从下面这个例子开始,可以容易的理解模版继承:
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Index</title>
        <link rel="stylesheet"
              href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"
              integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
              crossorigin="anonymous">
        <style>
            * {
                margin: 0;
                padding: 0;
            }
    
            .header {
                 100%;
                height: 50px;
                background-color: #369;
            }
        </style>
    </head>
    <body>
    <div class="header"></div>
    <div class="container">
        <div class="row">
            <div class="col-md-3">
                {#     提高复用性,使用页面更方便       #}
                {% include 'adviser.html' %}
    
            </div>
            <div class="col-md-9">
                {# 设置盒子等待重写       #}
                {% block con %}
                {% endblock %}
            </div>
        </div>
    </div>
    
    </body>
    </html>
    base.html
    这个模版,我们把它叫作 base.html, 它定义了一个可以用于两列排版页面的简单HTML骨架。“子模版”的工作是用它们的内容填充空的blocks。
    在这个例子中, block 标签定义了一个可以被子模版内容填充的block。 block 告诉模版引擎: 子模版可能会覆盖掉模版中的这些位置
    {% extends 'base.html' %}
    {% block con %}
        这里可以重写一部分内容
    {% endblock %}
    extends.html
    请注意,子模版并没有定义 sidebar block,所以系统使用了父模版中的值。父模版的 {% block %} 标签中的内容总是被用作备选内容(fallback)。
    这种方式使代码得到最大程度的复用,并且使得添加内容到共享的内容区域更加简单,例如,部分范围内的导航。
    这里是使用继承的一些提示:
    如果你在模版中使用 {% extends %} 标签,它必须是模版中的第一个标签。其他的任何情况下,模版继承都将无法工作。
    在base模版中设置越多的 {% block %} 标签越好。请记住,子模版不必定义全部父模版中的blocks,所以,你可以在大多数blocks中填充合理的默认内容,然后,只定义你需要的那一个。多一点钩子总比少一点好。
    如果你发现你自己在大量的模版中复制内容,那可能意味着你应该把内容移动到父模版中的一个 {% block %} 中。
    Win a contest, win a challenge
  • 相关阅读:
    用Vue来实现音乐播放器(10):Scroll组件的抽象和应用
    Vue的生命周期
    用Vue来实现音乐播放器(九):歌单数据接口分析
    Java中StringBuilder和StringBuffer的区别
    StringBuilder类型与String类型相互转换
    List中Add()与AddAll()的区别
    Map集合遍历的四种方式
    Object类型转换为Integer
    web开发中常用到的状态码
    mysql--从不订购的客户
  • 原文地址:https://www.cnblogs.com/pandaboy1123/p/9672416.html
Copyright © 2011-2022 走看看