base.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>{{title}}</title> <style> .header { height: 50px; background-color: fuchsia;; } .content{ height:300px; } .footer{ height:50px; background-color: thistle; } </style> </head> <body> <div class="header">Nav Area</div> <div class="content"> {% block content %} {% endblock %} </div> <div class="footer">Foot Area</div> </body> </html>
index.html
{% extends 'base.html'%}
{% block content %}
<div>
<h1>我正在努力学习</h1>
</div>
{% endblock %}
