HTML|Flask之模板繼承
- 2019 年 11 月 24 日
- 筆記
1 什麼是模板繼承
模板繼承是jinja裡面最有力的部分了。就相當於在模板裡面創建一個基礎的骨架，裡面的內容一般是一個網站中的常用元素，比如說網頁的頭部與尾部。這樣下次需要用的話我們直接繼承就好了。
2 基礎模板
我們來新建一個 base.html，它定義了一個簡單的 HTML 骨架，用 於顯示一個簡單的兩欄頁面。「子」模板的任務是用內容填充空的塊：
|
<!DOCTYPE html><html><head> {% block head %} <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}"> <title>{% block title %}{% endblock %} – My Webpage</title> {% endblock %}</head><body> <div id="content">{% block content %}{% endblock %}</div> <div id="footer"> {% block footer %} © Copyright 2010 by <a href="http://www.baidu.com/">you</a>. {% endblock %} </div></body></html> |
|---|
在這個例子中，{% block %}定義了幾個可以被子模版填充的地方。接下來我們來寫幾個子模版：
|
{% extends "test01.html" %}{% block title %}Index{% endblock %}{% block head %} {{ super() }} <style type="text/css"> .important { color: #336699; } </style>{% endblock %}{% block content %} <h1>hello</h1> <p> 歡迎您{% endblock %} |
|---|
效果如下：
這裡 {% extends %} 標記是關鍵，它告訴模板引擎這個模板「擴展」了另一個模板， 當模板系統評估這個模板時會先找到父模板。這個擴展標記必須是模板中的第一個標記。如果要使用父模板中的塊內容，就要使用 {{ super() }} 。
END
實習主編 | 王文星
責 編 | 劉玉江
where2go 團隊
