& lt; !DOCTYPE html>
& lt; html lang=癳n”比;
& lt; head>
& lt;元charset=皍tf - 8”比;
& lt; title> Title
& lt;/head>
& lt; body>
学生详情页:
{{学生}}
& lt;/body>
& lt;/html>
为什么要有模板的继承与引用?
学前端的时候写的页面比较复杂,每个页面都有相同的地方。
模板的继承
首先,新建一个父类页面。<强>挖好坑1和坑2。
{%加载静态%}
& lt; !DOCTYPE html>
& lt; html lang=坝τ谩北?
& lt; head>
& lt;元charset=皍tf - 8”比;
& lt;元http-equiv=癤-UA-Compatible”内容=癐E=边缘”比;
& lt;元name=笆哟啊蹦谌?翱矶?设备宽度,初始=1”比;
& lt; !——上述3个元标签*必须*放在最前面,任何其他内容都*必须*跟随其后!——比;
& lt; !——挖的坑,通过模板标签块来实现模板的继承与引用——比;
& lt; title>{%块标题%}{% endblock %} & lt;/title>
& lt; !——引导比;
& lt;链接的href=" https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css”rel=把奖怼北?
& lt; !——HTML5垫片和回应。js是为了让IE8支持HTML5元素和媒体查询(媒体查询)功能,比;
& lt; !——警告:通过文件://协议(就是直接将html页面拖拽到浏览器中)访问页面时做出回应。js不起作用,比;
& lt; !——(如果lt IE 9)比;
& lt;脚本src=" https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js”祝辞& lt;/script>
& lt;脚本src=" https://cdn.jsdelivr.net/npm/respond.js@1.4.2/桌子/respond.min.js”祝辞& lt;/script>
& lt; ! [endif]——比;
& lt;/head>
& lt; body>
& lt; !——挖的坑2,通过模板标签块来实现模板的继承与引用——比;
{%块内容%}{% endblock %}
& lt; !——jQuery(引导的所有JavaScript插件都依赖jQuery,所以必须放在前边)——比;
& lt;脚本src=" https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js”祝辞& lt;/script>
& lt; !——加载引导的所有JavaScript插件。你也可以根据需要只加载单个插件。——比;
& lt;脚本src=" https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js”祝辞& lt;/script>
& lt;/body>
& lt;/html>
其次,子类页面的继承。
{% '老师/扩展基础。html ' %}
{%块标题%}学生列表{% endblock %}
{%块内容%}
& lt; h2>学生列表& lt;/h2>
& lt;表类=氨怼痹?
& lt; thead>
& lt; tr>
& lt; th> ID
& lt; th>姓名& lt;/th>
& lt; th>年龄& lt;/th>
& lt; th>性别& lt;/th>
& lt;/tr>
& lt;/thead>
& lt; tbody>
{%学生学生%}
如果学生& lt; tr {%。性=='女' %}{%其他%}{% endif %}祝辞
& lt; td> & lt; a href=" https://www.yisu.com/zixun/{% url 'teacher: student_detail”学生。id %}”在{{学生。id}} & lt;/a> & lt;/td>
& lt; td> {{student.name}} & lt;/td>
& lt; td>{{学生。年龄}}& lt;/td>
& lt; td>{{学生。性}}& lt;/td>
& lt;/tr>
{% endfor %}
& lt;/tbody>
& lt;/table>
{% endblock %}
