默认配置下，Django 的模板系统会自动找到app下面的templates文件夹中的模板文件。
`Django 模板查找机制`： Django 查找模板的过程是在每个 app 的 templates 文件夹中找（而不只是当前 app 中的代码只在当前的 app 的 templates 文件夹中找）。各个 app 的 templates 形成一个文件夹列表，Django 遍历这个列表，一个个文件夹进行查找，当在某一个文件夹找到的时候就停止，所有的都遍历完了还找不到指定的模板的时候就是 `Template Not Found` （过程类似于Python找包）。这样设计有利当然也有弊，有利是的地方是一个app可以用另一个app的模板文件，弊是有可能会找错了。所以我们使用的时候在 templates 中建立一个 app 同名的文件夹，这样就好了。
如下图：
```
├── db.sqlite3
├── demo
│ ├── __init__.py
│ ├── settings.py
│ ├── urls.py
│ └── wsgi.py
├── learn
│ ├── admin.py
│ ├── __init__.py
│ ├── models.py
│ ├── views.py
│ └── tests.py
├── templates
│ └── learn
│ ├── base.html
│ ├── bottom.html
│ ├── home.html
│ └── nav.html
└── manage.py
```
## 模板的结构
网站模板的设计，一般的，我们做网站有一些通用的部分，比如 导航，底部，访问统计代码等等
```
├── templates
│ └── learn
│ ├── base.html
│ ├── bottom.html
│ ├── home.html
│ └── nav.html
```
### 继承母版 extends
每个页面只能继承一个母版，且必须位于页面最上方。
>[danger] 何时引入JS和CSS？
可以在母版合适的位置使用相应的block进行，CSS可以在头文件中引入，JS可以在body标签的上一行引入。
~~~
{% extends 'learn/base.html' %}
~~~
### 引入模块include
用于引入一些小模块或者组件
### 渲染时模块替换 block
* `导航栏` nav.html
```
<div>导航栏</div>
```
* `页面底部` bottom.html
```
<div>页面底部</div>
```
* `基础模板` base.html
```
<!DOCTYPE html>
<html>
<head>
<title>{% block title %}默认标题{% endblock %}</title>
{% block css %}
{% endblock %}
</head>
<body>
{% include 'learn/nav.html' %}
{% block content %}
<div>这里是默认内容，所有继承自这个模板的，如果不覆盖就显示这里的默认内容。</div>
{% endblock %}
{% include 'learn/bottom.html' %}
{% block js %}
{% endblock %}
</body>
</html>
```
* `主页` home.html
```
{% extends 'learn/base.html' %}
{% block css %}
<link rel="stylesheet" href="/static/commons.css" />
{% endblock %}
{% block title %}
Home Page
{% endblock %}
{% block content %}
<h2>This is home page.</h2>
{% endblock %}
{% block js %}
<script src="/static/jquery.js"></script>
{% endblock %}
```
