django+SQLite搭建轻量级个人博客(三)Django模板系统之页面继承

django模板本质上是HTML,但是夹杂了一些变量和模板标签:
1、{{}}

用{{}}包围的是变量,如{{person_name}},这表示把给定变量的值插入。

2、{%%}

用{%%}包围的是块标签,块标签告诉模板系统做一些事情,如:

{% for article in articles %}{% endfor %}

{%if 条件%}{% else %}{%endif%}
{% block content %}{% endblock %}
{% block css %}{% endblock %}

{% block js %}{% endblock %}
......
{% extends 'base.html' %} #注解,基于base.html进行扩展
......

3、举个简单例子

例子描述:网站index.html等模板设计时,通用部分放到base.html,index.html等网页通过extends方式引用。 

1)base.html

仅列出head部分作为示例:

<head>
<meta charset="utf-8">
#注解:下面3个link标签是每个页面都会用的到的通用部分
<link href="/static/css/base.css" rel="stylesheet">
<link href="/static/css/index.css" rel="stylesheet">
<link href="/static/css/m.css" rel="stylesheet">
#注解:下面的2个block,意思是其他页面的css js非通用部分可以扩展
{#用于页面的css扩展#}
{% block css %}
{% endblock %}

{#用于页面的js扩展#}
{% block js %}
{% endblock %}
</head>
#注解:其他页面的content 正文 ,可以扩展
<body>
{% block content %}
{% endblock %}
</body>

2)index.html
#注解:index.html在base.html 框架的基础上扩展
{% extends 'base.html' %}
注解:index.html有个特别的css需要扩展,在html中可以这样写
{% block css %}
<link href="/static/css/pagination.css" rel="stylesheet">
{% endblock %}
注解:写正文
{% block content %}
。。。。。。。。。。巴拉巴拉。。。。。。
{% endblock %}

猜你喜欢

转载自www.cnblogs.com/xuexizongjie/p/11729950.html