include & extends
一個網站當然不可能只有一個網頁,若每個網頁的內容大致相同的話,那重複撰寫相同的 html 碼實在很煩人,所以就可以使用 include 或 extends 來複製相同的部份。
include tag
首先將每個網頁相同的頭尾寫在 head.html 及 tail.html 裏,並將二個檔案置於 templates 目錄中
head.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<title>MahalJSP</title>
</head>
<body leftmargin="0" topmargin="0" rightmargin="0" topmargin="0">
<table border="1" cellpadding="0" cellspacing="0" width="98%" align="center">
<tr>
<td>
tail.html
</td>
</tr>
</table>
</body>
</html>
然後在 templates 目錄下新增 first.html,內容如下
🔒 更多內容,請登入會員繼續閱讀。
立即登入當然 setting.py 及 urls.py 也要進行設定,此時輸入 localhost:7000/first 即可看到網頁內容了。日後要新增其它網頁,只要新網頁前後新增 include tag即可。
extends
extends 是另一個更好用的方式。前篇的 home.html,其實是為了這個方式製作的。將 home.html copy 到 templates 之下並改名為 base.html。因為每個網頁的不同處是位於 <div id=”content”> 之中,所以在此區塊中使用 block 區隔出來,如下。
