Django 模板继承 (extend) 笔记

本文介绍了Django模板继承的概念,通过一个实例展示了如何使用`extend`创建子模版,子模版通过填充或覆盖`base.html`中的`block`区域来定制内容。在`base.html`中定义了HTML骨架,而子模版则负责具体实现。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

通过从下面这个例子,可以容易的理解模版继承:


base.html模板:它定义了一个简单HTML骨架。“子模版”的工作是“填充空的或者覆盖“  base.html里的blocks。

<!DOCTYPE html>
	<html lang="en">
	<head>
	    <link rel="stylesheet" href="style.css" />
	    <title>{% block title %}My amazing site{% endblock %}</title>  -------设置默认内容(My amazing site)
	</head>

	<body>
	    <div id="sidebar">
	        {% block sidebar %}              
	        <ul>
	            <li><a href="/">Home</a></li>
	            <li><a href="/blog/">Blog</a></li>
	        </ul>
	        {% endblock %}
	    </div>

	    <div id="content">
	        {% block content %}{% endblock %}				-------为block设置名字:content
	    </div>
	</body>
	</html>

注意:

如果你在模版中使用 {% extends %} 标签,它必须是模版中的第一个标签。其他的任何情况下,模版继承都将无法工作。

{{ block.super content}}   -------保留继承下来的内容,然后追加你的内容





子模版:

在这个例子中, block 标签定义了三个可以被子模版内容填充的block。 block 告诉模版引擎: 子模版可能会覆盖掉模版中的这些位置。

{% extends "base.html" %}		----------继承base.html模板所有内容
 
	{% block title %}My amazing blog{% endblock %}----(My amazing blog)覆盖base.html(My amazing site)
	
	{% block content %}											
		{% for entry in blog_entries %}
		    <h2>{{ entry.title }}</h2>
		    <p>{{ entry.body }}</p>
		{% endfor %}
	{% endblock %}


子模版经过渲染后是这样的:

<!DOCTYPE html>
	<html lang="en">
	<head>
	    <link rel="stylesheet" href="style.css" />
	    <title>My amazing blog</title>-------修改后
	</head>
	 
	<body>
	    <div id="sidebar">-------继承下来的内容
	        <ul>
	            <li><a href="/">Home</a></li>
	            <li><a href="/blog/">Blog</a></li>
	        </ul>
	    </div>
	 
	    <div id="content">-------修改后
	        <h2>Entry one</h2>
	        <p>This is my first entry.</p>
	 
	        <h2>Entry two</h2>
	        <p>This is my second entry.</p>
	    </div>
	</body>
	</html>




评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值