zoukankan      html  css  js  c++  java
  • django 模板继承

    1. 在实际的页面显示中会有多个页面有相同的显示信息,如果每个页面都写相同的代码,会让你的代码冗余,为了解决这个问题我们就把相同的代码写在一个文件里,供其它文件使用,这个文件就是一个母版,其它文件对这个母版进行继承,就会显示这个母版的信息

    2. 怎么完成这个操作呢?看代码:

      我们先在母版文件里写好其它文件所需要的固定内容
      比如:
      文件名为:  base.html
      <div style="background-color: red;">
          <span style="font-size: 40px;text-align: center;">这是导航栏</span>
      </div>
      
      然后我们需要在其他的文件里进行继承:
       {% extends 'base.html' %}  ------   就相当于是将base里边的所有代码拿来使用,你不需要在写html代码;
      这段代码就是继承母版文件base.html的代码,这就减少了你的代码量,这个可以在多个文件里应用,
      
    3. 如果我们需要对自己定义的页面操作时怎么办?

      #在模板中定义一个block块,像这样:
          {% block conter %}      ------   conter是自己随便起的名字
              这是母版页面
          {% endblock %}
      #这个母版里你可以定义好哪些地方需要改动,就在那里定义这么一个标签,
      
      #但你需要在你的文件里子文件中进行相应的操作时:
      {% block conter%}
          <span style="font-size: 50px">这是页面1</span>
      {% endblock %}
      # 你只需要将模板中的这个标签写上,在标签里进行你的操作,这样就会改变你的子文件的样式,
      # 这就相当于是子标签在继承母版的时候应用了母版的方法,然后将母版的方法重写了;
      
      
    4. 如果我们需要继承母版的页面,想要母版中的block中的样式在子页面中也显示,而且还需要显示我子页面修改的内容怎么办?

      {% block conter%}
          {{ block.super }}      ------    #使用这个方法就会将母版页面中的样式拿过来,不做任何的修改,下边是你子页面的样式
          <span style="font-size: 50px">这是页面2</span>
      {% endblock %}
      
    5. 继承js和css也是一样的

      {% block css%}
            这是母版css样式
      {% endblock %}
      
      {% block js%}
            这是母版js样式
      {% endblock %}
      

      将它们写在这固定的位置,子页面继承的时候只需要将其应用,在里边写入自己的语法就会覆盖母版的内容,已达到改变子页面的效果

    6. 母版中尽量多定义一些block标签,这样你在子页面中的可扩展性就会越大

  • 相关阅读:
    使用NSIS打包程序
    vue.config.js 的完整配置(超详细)!
    前端 Electron Nsis Web 安装包配置方法
    使用NSIS制作安装包
    Echarts X轴(xAxis)
    Windows环境下Jenkins打包、发布、部署
    一、NSIS介绍
    织梦DEDECMS首页调用单页文档内容并带过滤HTML的方法
    php调试方法
    jQuery 图片轮播滚动效果
  • 原文地址:https://www.cnblogs.com/zhufanyu/p/11665363.html
Copyright © 2011-2022 走看看