Python Web开发：继承模板
来自CloudWiki
背景
本节知识基本参考了如下内容：
如不清楚，可回溯查看。
目的
新建“企业概况”和“荣誉资质”子页面
实训步骤
继承模板
打开about应用，创建templates文件夹
然后创建survey.html网页文件
{% extends "base.html" %}
{% load staticfiles %}
{% block title %}
企业概况
{% endblock %}
{% block content %}
<!-- 广告横幅 -->
<div class="container-fluid">
<div class="row">
<img class="img-responsive model-img" src="{% static 'img/about.jpg' %}">
</div>
</div>
<!-- 主体内容 -->
{% endblock %}
同理，创建honor.html子页面：
{% extends "base.html" %}
{% load staticfiles %}
{% block title %}
荣誉资质
{% endblock %}
{% block content %}
<!-- 广告横幅 -->
<div class="container-fluid">
<div class="row">
<img class="img-responsive model-img" src="{% static 'img/about.jpg' %}">
</div>
</div>
<!-- 主体内容 -->
<div>
主体内容
</div>
{% endblock %}
修改View层
修改aboutApp/views.py文件，
以便有效的渲染刚才的两个网页。
from django.shortcuts import render
from django.shortcuts import HttpResponse
# Create your views here.
def survey(request):
'''html = '<html><body>企业概况</body></html>'
return HttpResponse(html)'''
return render(request,'survey.html',{'active_menu':'about',})
def honor(request):
'''html = '<html><body>荣誉资质</body></html>'
return HttpResponse(html)'''
return render(request,'honor.html',{'active_menu':'about',})
完善代码
最后遗留一个小问题，如果当前已经在“企业概况”页面内，此时光标移到“荣誉资质”内 两个链接颜色是一样的，为了有效进行区分，在style.css中添加如下代码：
/* 二级菜鼠标移过时属性 */
.navbar-default .navbar-nav li ul a:hover{
color:#fff;
background-color:#005197;
}
/* 一级菜单激活时二级菜单鼠标移过时属性 */
.navbar-default .navbar-nav li.active ul a:hover{
color:#fff;
background-color:#022a4d;
}
效果图
