The page content may be used, such as navigation, footer information components stored in separate files in a small block and then used where needed, can be introduced anywhere in the file by the following syntax.
Template components:
Create a new component zujian.html file (a static fixed-written pages)
In the new html position in the file plus the need to introduce include tags: {% include "zujian.html"%}
Template component reference presentation:
zujian.html
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <style> 6 .c1, .nav {margin: 0 auto;width: 1200px;background-color: #d6d6d6;color: white;} 7 .navleft {float: left;text-align: left;} 8 .navright {float: right;} 9 .fixed:after {content: "";display: block;clear: both;} 10 ul, li {list-style: none;display: inline;margin: 0;padding: 0;} 11 </style> 12 <title>模板组件</title> 13 </head> 14 <body> 15 <div class="c1"> 16 <div class="nav fixed"> 17 <div class="navleft "> 18 <ul> 19 <li>古诗</li> 20 <</Quatrains>Lili> 21 <li>诗经</li> 22 </ul> 23 </div> 24 <div class="navright"> 25 <ul> 26 <li>登录</li> 27 <li>注册</li> 28 </ul> 29 </div> 30 </div> 31 </div> 32 33 </body> 34 </html>
zujian_demo.html
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>模板组件引入演示</title> 6 </head> 7 <body> 8 <div> {% include "zujian.html" %}</div> 9 <div><h1>Template components introduced demo (include tag can be placed anywhere)</h1></div> 10 <div> {% include "zujian.html" %}</div> 11 </body> 12 </html>
views.py
1 def zujian(request): 2 return render(request,"zujian.html") 3 def zujian_demo(request): 4 return render(request,"zujian_demo.html")
The results demonstrate: