找回密码
 立即注册

扫一扫，访问微社区

QQ登录

只需一步，快速开始

返回列表 发新帖
查看: 2113|回复: 0

[求助] django关于模板继承

1

主题

1

帖子

1

积分

贫民

积分
1
Luenci 发表于 2018-12-8 15:07:10 | 显示全部楼层 |阅读模式
本人最近在学python的django框架，搭建一个个人的技术博客。现在遇到一个问题，关于模板的继承。我定义了一个导航的网页为母模板，但是子模版在继承这个网页后，子模版的内容全部被覆盖了。为什么？求助 谢谢各位大佬
代码如下：
母模板：
  1. <!DOCTYPE html>
  2. <html lang="zh-hans-cn">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="Author" content="Rin">
  6. <title>拖动导航</title>

  8. <link rel="stylesheet" href="../static/拖动导航/css/asidenav.css">

  10. </head>
  11. <body style="background: black;">
  12. {% block grid %} <!-- 定义导航模板-->
  13. <div>
  14.     <svg width="0" height="0">
  15.         <defs>
  16.             <filter id="goo">
  17.                 <feGaussianBlur in="SourceGraphic" stdDeviation="10" result="blur"></feGaussianBlur>
  18.                 <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9" result="goo"></feColorMatrix>
  19.                 <feComposite in="SourceGraphic" in2="goo" operator="atop"></feComposite>
  20.             </filter>
  21.         </defs>
  22.     </svg>
  23.     <div class="aside-nav bounceInUp animated" id="aside-nav">
  24.         <label for="" class="aside-menu" title="按住拖动">菜单</label>

  26.         <a href="index.html" class="menu-item menu-first">首页</a>
  27.         <a href="time.html" class="menu-item menu-second">时光轴</a>
  28.         <a href="Article.html" class="menu-item menu-third">文章</a>
  29.         <a href="weichat.html" class="menu-item menu-line menu-fourth">关注<br>微信</a>
  30.     </div>
  31. </div>   

  33. <script type="text/javascript" src="../static/拖动导航/js/jquery.min.js"></script>
  34. <script type="text/javascript" src="../static/拖动导航/js/asidenav.js"></script>

  36. {% endblock %}
  37. </body>
  38. </html>
复制代码
子模板
  1. <!DOCTYPE html>
  2. <html>
  3. <head lang="zh-CN">
  4. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  5. <meta charset="UTF-8">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  7. <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
  8. <title>时间轴</title>

  10. <link rel="stylesheet" href="../static/TimeLine/Timeline/css/public.css">

  12. <script src="../static/TimeLine/Timeline/js/jquery.min.js"></script>
  13. <script src="../static/TimeLine/Timeline/js/jquery_flexslider.js"></script>

  15. </head>
  16. <body>
  17. {% extends "navigation.html" %} <!-- 继承母模板-->
  18. <div class="about-history" id="fzlc">
  19.     <header class="about-title title-white">
  20.         <h3 class="wow fadeInUp" style="visibility: visible; animation-name: fadeInUp;">脚踏实地，仰望星空</h3>
  21.         <p class="wow fadeInUp" data-wow-delay=".2s" style="visibility: visible; animation-delay: 0.2s; animation-name: fadeInUp;">HISTORY</p>
  22.     </header>
  23.     <div class="about-history-list wow zoomIn" data-wow-delay=".4s" style="visibility: visible; animation-delay: 0.4s; animation-name: zoomIn;">               
  24.         <div class="flex-viewport" style="overflow: hidden; position: relative;">
  25.             <ul class="slides clearfix list" style="width: 2600%; transition-duration: 0s; transform: translate3d(0px, 0px, 0px);">

  27.                 <li style="width: 253px; float: left; display: block;">
  28.                     {% for Time in blog_time %}
  29.                     <div class="item">
  30.                     {% if Time.id  %}
  31.                             <h3>{{ Time.time }}</h3>
  32.                         <div class="desc">
  33.                             <p style="color: #000155">
  34.                             {{ Time.time_title }}
  35.                             <br>
  36.                             {{ Time.things }}
  37.                             </p>
  38.                         </div>
  39.                     </div>
  40.                     {% endif %}
  41.                 </li>

  43.                 <li style="width: 253px; float: left; display: block;">
  44.                     <div class="item">
  45.                         {% if Time.id == Time.id.last %}
  46.                             <h3>{{ Time.time }}</h3>
  47.                             <div class="desc">
  48.                             <p style="color: #000155">
  49.                             {{ Time.time_title }}
  50.                             <br>
  51.                             {{ Time.things }}
  52.                             </p>
  53.                         </div>
  54.                     </div>
  55.                 </li>
  56.                     {% endif %}
  57.                 {% endfor %}

  59.             </ul>
  60.         </div>
  61.         <ul class="flex-direction-nav">
  62.             <li class="flex-nav-prev"><a class="flex-prev" href="#"><</a></li>
  63.             <li class="flex-nav-next"><a class="flex-next" href="#">></a></li>
  64.          </ul>
  65.     </div>
  66. </div>
  67. <script>
  68.         $(function(){
  69.                 if((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))){
  70.                         //phone
  71.                 }else{
  72.                         //PC
  73.                         $(".about-history-list").flexslider({animation:"slide",slideshow:false,controlNav:false,itemWidth:253,itemMargin:31,prevText:"<",nextText:">",move:1});
  74.                 }
  75.         });
  76. </script>
  77.     <div><!-- 在子模板中显示导航模板-->
  78.         {% block grid %}
  79.         {% endblock %}
  80.     </div>
  81. </body>
  82. </html>
复制代码


django

相关帖子
回复

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回顶部 返回列表