主模板:master.html
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>{% block title %} {% endblock %}</title> ???#替换位置加{% block title %}{% endblock %} ???<link rel="stylesheet" href="/static/commons.css"> ???<style> #全局css ???????.pg-header{ ???????????height: 48px; ???????????background-color: seashell; ???????????color: green; ???????} ???</style>
{% block css %} {% endblock%} ??#自定义css 由继承模板时加入</head><body><div class="pg-header">管理界面</div>{% block content %} {% endblock %} ??#替换位置<script src="/static/jquery.js"></script> ?#全局js
{% block js %} {% endblock %} ?#自定义js 由继承模板时加入</body></html>
# 继承模板:
{% extends ‘master.html‘ %} ?????#继承模板需要添加,继承的模板来自master.html{% block title %}用户管理{% endblock %} ??#替换模板中title的位置{% block css %}<style>...</style>{% endblock %} #自定义css{% block content %} ????#替换模板中content的位置 ???<h1>用户管理</h1> ???<ul> ???????{% for u in user_list %} ???????????<li>{{ u }}</li> ???????{% endfor %} ???</ul>{% endblock %}
{% block js %}<script src="..."></script>{% endblock %} ?#自定义js
Django-website 程序案例系列-6 html模板文件详解
原文地址:http://www.cnblogs.com/kuku0223/p/7895513.html