常用模板标签

1.if语句

1.所有的标签都是在{%%}之间
2.if标签you闭合标签.就是{% endif %}.
3.if标签的判断运算符,就跟python中的判断运算符是一样的.==、!=、<、<=、>、>=、in、not in、is、is not等判断运算符
4.还可以使用elif和else

2.for...in...标签：

for...in...类似于Python中的for...in...。可以遍历列表、元组、字符串、字典等一切可以遍历的对象。示例代码如下：

{% for person in persons %}
<p>{{ person.name }}</p>
{% endfor %}

如果想要反向遍历，那么在遍历的时候就加上一个reversed。示例代码如下：

{% for person in persons reversed %}
<p>{{ person.name }}</p>
{% endfor %}

遍历字典的时候，需要使用items、keys和values等方法。在DTL中，执行一个方法不能使用圆括号的形式。遍历字典示例代码如下：

{% for key,value in person.items %}
<p>key：{{ key }}</p>
<p>value：{{ value }}</p>
{% endfor %}

在for循环中，DTL提供了一些变量可供使用。这些变量如下：

  • forloop.counter：当前循环的下标。以1作为起始值。
  • forloop.counter0：当前循环的下标。以0作为起始值。
  • forloop.revcounter：当前循环的反向下标值。比如列表有5个元素，那么第一次遍历这个属性是等于5，第二次是4，以此类推。并且是以1作为最后一个元素的下标。
  • forloop.revcounter0：类似于forloop.revcounter。不同的是最后一个元素的下标是从0开始。
  • forloop.first：是否是第一次遍历。
  • forloop.last：是否是最后一次遍历。
  • forloop.parentloop：如果有多个循环嵌套，那么这个属性代表的是上一级的for循环。

模板中的for…in…没有continue和break语句，这一点和Python中有很大的不同，一定要记清楚！

3.for...in...empty标签：

这个标签使用跟for...in...是一样的，只不过是在遍历的对象如果没有元素的情况下，会执行empty中的内容。示例代码如下：

{% for person in persons %}
<li>{{ person }}</li>
{% empty %}
暂时还没有任何人
{% endfor %}

4.with标签:

1.在模板中,想要定义变量,可以通过with语句来实现.
2.with语句有两种使用方式,第一种是with xxx=xxx的形式,第二种是with xx as xx
的形式.
3.定义的变量只能在with语句块中使用,在with语句块使用是取不到这个变量的
示例代码如下:

    {% with zs=persons.0%}
        <p>{{ zs }}</p>
        <p>{{ zs }}</p>
    {% endwith %}
    下面这个因为超过了with语句块，因此不能使用
    <p>{{ zs }}</p>

    {% with persons.0 as zs %}
        <p>{{ zs }}</p>
    {% endwith %}

5.url标签笔记：

url标签：在模版中，我们经常要写一些url，比如某个a标签中需要定义href属性。当然如果通过硬编码的方式直接将这个url写死在里面也是可以的。但是这样对于以后项目维护可能不是一件好事。因此建议使用这种反转的方式来实现，类似于django中的reverse一样。示例代码如下：

<a href="{% url ‘book:list‘ %}">图书列表页面</a>

如果url反转的时候需要传递参数，那么可以在后面传递。但是参数分位置参数和关键字参数。位置参数和关键字参数不能同时使用。示例代码如下：

# path部分
path(‘detail/<book_id>/‘,views.book_detail,name=‘detail‘)

# url反转，使用位置参数
<a href="{% url ‘book:detail‘ 1 %}">图书详情页面</a>

# url反转，使用关键字参数
<a href="{% url ‘book:detail‘ book_id=1 %}">图书详情页面</a>

如果想要在使用url标签反转的时候要传递查询字符串的参数，那么必须要手动在在后面添加。示例代码如下：

<a href="{% url ‘book:detail‘ book_id=1 %}?page=1">图书详情页面</a>

如果需要传递多个参数，那么通过空格的方式进行分隔。示例代码如下：

<a href="{% url ‘book:detail‘ book_id=1 page=2 %}">图书详情页面</a>

6.autoescape自动转义

  1. DTL中默认已经开启了自动转义,会将那些特殊字符进行转义.比如会将<转义成&lt;等.
  2. 如果你不知道自己在干什么,那么最好是使用DTL的自动转义.这样网站才不容易出现XSS漏洞.
  3. 如果变量确实是可信任的,那么可以使用autoescape标签来关掉自动转义.示例代码如下: 
        {% autoescape off %}
        {% info %}
    {% endautoescape%}

7.verbatim标签

verbatim标签:默认在DTL模板中是会去解析那些特殊字符的.比如{{,{%和%}等.如果你在某个代码片段中不想使用DTL的解析引擎,那么你可以把这个代码片段放在verbatim标签中.示例代码如下:

{% verbatim %}
    {{ hello }}
{% endverbatim %}

*:first-child {
margin-top: 0 !important;
}

.markdown-body>*:last-child {
margin-bottom: 0 !important;
}

.markdown-body .headeranchor-link {
position: absolute;
top: 0;
bottom: 0;
left: 0;
display: block;
padding-right: 6px;
padding-left: 30px;
margin-left: -30px;
}

.markdown-body .headeranchor-link:focus {
outline: none;
}

.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4,
.markdown-body h5,
.markdown-body h6 {
position: relative;
margin-top: 1em;
margin-bottom: 16px;
font-weight: bold;
line-height: 1.4;
}

.markdown-body h1 .headeranchor,
.markdown-body h2 .headeranchor,
.markdown-body h3 .headeranchor,
.markdown-body h4 .headeranchor,
.markdown-body h5 .headeranchor,
.markdown-body h6 .headeranchor {
display: none;
color: #000;
vertical-align: middle;
}

.markdown-body h1:hover .headeranchor-link,
.markdown-body h2:hover .headeranchor-link,
.markdown-body h3:hover .headeranchor-link,
.markdown-body h4:hover .headeranchor-link,
.markdown-body h5:hover .headeranchor-link,
.markdown-body h6:hover .headeranchor-link {
height: 1em;
padding-left: 8px;
margin-left: -30px;
line-height: 1;
text-decoration: none;
}

.markdown-body h1:hover .headeranchor-link .headeranchor,
.markdown-body h2:hover .headeranchor-link .headeranchor,
.markdown-body h3:hover .headeranchor-link .headeranchor,
.markdown-body h4:hover .headeranchor-link .headeranchor,
.markdown-body h5:hover .headeranchor-link .headeranchor,
.markdown-body h6:hover .headeranchor-link .headeranchor {
display: inline-block;
}

.markdown-body h1 {
padding-bottom: 0.3em;
font-size: 2.25em;
line-height: 1.2;
border-bottom: 1px solid #eee;
}

.markdown-body h2 {
padding-bottom: 0.3em;
font-size: 1.75em;
line-height: 1.225;
border-bottom: 1px solid #eee;
}

.markdown-body h3 {
font-size: 1.5em;
line-height: 1.43;
}

.markdown-body h4 {
font-size: 1.25em;
}

.markdown-body h5 {
font-size: 1em;
}

.markdown-body h6 {
font-size: 1em;
color: #777;
}

.markdown-body p,
.markdown-body blockquote,
.markdown-body ul,
.markdown-body ol,
.markdown-body dl,
.markdown-body table,
.markdown-body pre,
.markdown-body .admonition {
margin-top: 0;
margin-bottom: 16px;
}

.markdown-body hr {
height: 4px;
padding: 0;
margin: 16px 0;
background-color: #e7e7e7;
border: 0 none;
}

.markdown-body ul,
.markdown-body ol {
padding-left: 2em;
}

.markdown-body ul ul,
.markdown-body ul ol,
.markdown-body ol ol,
.markdown-body ol ul {
margin-top: 0;
margin-bottom: 0;
}

.markdown-body li>p {
margin-top: 16px;
}

.markdown-body dl {
padding: 0;
}

.markdown-body dl dt {
padding: 0;
margin-top: 16px;
font-size: 1em;
font-style: italic;
font-weight: bold;
}

.markdown-body dl dd {
padding: 0 16px;
margin-bottom: 16px;
}

.markdown-body blockquote {
padding: 0 15px;
color: #777;
border-left: 4px solid #ddd;
}

.markdown-body blockquote>:first-child {
margin-top: 0;
}

.markdown-body blockquote>:last-child {
margin-bottom: 0;
}

.markdown-body table {
display: block;
width: 100%;
overflow: auto;
word-break: normal;
word-break: keep-all;
}

.markdown-body table th {
font-weight: bold;
}

.markdown-body table th,
.markdown-body table td {
padding: 6px 13px;
border: 1px solid #ddd;
}

.markdown-body table tr {
background-color: #fff;
border-top: 1px solid #ccc;
}

.markdown-body table tr:nth-child(2n) {
background-color: #f8f8f8;
}

.markdown-body img {
max-width: 100%;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.markdown-body code,
.markdown-body samp {
padding: 0;
padding-top: 0.2em;
padding-bottom: 0.2em;
margin: 0;
font-size: 85%;
background-color: rgba(0,0,0,0.04);
border-radius: 3px;
}

.markdown-body code:before,
.markdown-body code:after {
letter-spacing: -0.2em;
content: "\00a0";
}

.markdown-body pre>code {
padding: 0;
margin: 0;
font-size: 100%;
word-break: normal;
white-space: pre;
background: transparent;
border: 0;
}

.markdown-body .codehilite {
margin-bottom: 16px;
}

.markdown-body .codehilite pre,
.markdown-body pre {
padding: 16px;
overflow: auto;
font-size: 85%;
line-height: 1.45;
background-color: #f7f7f7;
border-radius: 3px;
}

.markdown-body .codehilite pre {
margin-bottom: 0;
word-break: normal;
}

.markdown-body pre {
word-wrap: normal;
}

.markdown-body pre code {
display: inline;
max-width: initial;
padding: 0;
margin: 0;
overflow: initial;
line-height: inherit;
word-wrap: normal;
background-color: transparent;
border: 0;
}

.markdown-body pre code:before,
.markdown-body pre code:after {
content: normal;
}

/* Admonition */
.markdown-body .admonition {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
position: relative;
border-radius: 3px;
border: 1px solid #e0e0e0;
border-left: 6px solid #333;
padding: 10px 10px 10px 30px;
}

.markdown-body .admonition table {
color: #333;
}

.markdown-body .admonition p {
padding: 0;
}

.markdown-body .admonition-title {
font-weight: bold;
margin: 0;
}

.markdown-body .admonition>.admonition-title {
color: #333;
}

.markdown-body .attention>.admonition-title {
color: #a6d796;
}

.markdown-body .caution>.admonition-title {
color: #d7a796;
}

.markdown-body .hint>.admonition-title {
color: #96c6d7;
}

.markdown-body .danger>.admonition-title {
color: #c25f77;
}

.markdown-body .question>.admonition-title {
color: #96a6d7;
}

.markdown-body .note>.admonition-title {
color: #d7c896;
}

.markdown-body .admonition:before,
.markdown-body .attention:before,
.markdown-body .caution:before,
.markdown-body .hint:before,
.markdown-body .danger:before,
.markdown-body .question:before,
.markdown-body .note:before {
font: normal normal 16px fontawesome-mini;
-moz-osx-font-smoothing: grayscale;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
line-height: 1.5;
color: #333;
position: absolute;
left: 0;
top: 0;
padding-top: 10px;
padding-left: 10px;
}

.markdown-body .admonition:before {
content: "\f056\00a0";
color: 333;
}

.markdown-body .attention:before {
content: "\f058\00a0";
color: #a6d796;
}

.markdown-body .caution:before {
content: "\f06a\00a0";
color: #d7a796;
}

.markdown-body .hint:before {
content: "\f05a\00a0";
color: #96c6d7;
}

.markdown-body .danger:before {
content: "\f057\00a0";
color: #c25f77;
}

.markdown-body .question:before {
content: "\f059\00a0";
color: #96a6d7;
}

.markdown-body .note:before {
content: "\f040\00a0";
color: #d7c896;
}

.markdown-body .admonition::after {
content: normal;
}

.markdown-body .attention {
border-left: 6px solid #a6d796;
}

.markdown-body .caution {
border-left: 6px solid #d7a796;
}

.markdown-body .hint {
border-left: 6px solid #96c6d7;
}

.markdown-body .danger {
border-left: 6px solid #c25f77;
}

.markdown-body .question {
border-left: 6px solid #96a6d7;
}

.markdown-body .note {
border-left: 6px solid #d7c896;
}

.markdown-body .admonition>*:first-child {
margin-top: 0 !important;
}

.markdown-body .admonition>*:last-child {
margin-bottom: 0 !important;
}

/* progress bar*/
.markdown-body .progress {
display: block;
width: 300px;
margin: 10px 0;
height: 24px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color: #ededed;
position: relative;
box-shadow: inset -1px 1px 3px rgba(0, 0, 0, .1);
}

.markdown-body .progress-label {
position: absolute;
text-align: center;
font-weight: bold;
width: 100%; margin: 0;
line-height: 24px;
color: #333;
text-shadow: 1px 1px 0 #fefefe, -1px -1px 0 #fefefe, -1px 1px 0 #fefefe, 1px -1px 0 #fefefe, 0 1px 0 #fefefe, 0 -1px 0 #fefefe, 1px 0 0 #fefefe, -1px 0 0 #fefefe, 1px 1px 2px #000;
-webkit-font-smoothing: antialiased !important;
white-space: nowrap;
overflow: hidden;
}

.markdown-body .progress-bar {
height: 24px;
float: left;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color: #96c6d7;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -1px 0 rgba(0, 0, 0, .1);
background-size: 30px 30px;
background-image: -webkit-linear-gradient(
135deg, rgba(255, 255, 255, .4) 27%,
transparent 27%,
transparent 52%, rgba(255, 255, 255, .4) 52%,
rgba(255, 255, 255, .4) 77%,
transparent 77%, transparent
);
background-image: -moz-linear-gradient(
135deg,
rgba(255, 255, 255, .4) 27%, transparent 27%,
transparent 52%, rgba(255, 255, 255, .4) 52%,
rgba(255, 255, 255, .4) 77%, transparent 77%,
transparent
);
background-image: -ms-linear-gradient(
135deg,
rgba(255, 255, 255, .4) 27%, transparent 27%,
transparent 52%, rgba(255, 255, 255, .4) 52%,
rgba(255, 255, 255, .4) 77%, transparent 77%,
transparent
);
background-image: -o-linear-gradient(
135deg,
rgba(255, 255, 255, .4) 27%, transparent 27%,
transparent 52%, rgba(255, 255, 255, .4) 52%,
rgba(255, 255, 255, .4) 77%, transparent 77%,
transparent
);
background-image: linear-gradient(
135deg,
rgba(255, 255, 255, .4) 27%, transparent 27%,
transparent 52%, rgba(255, 255, 255, .4) 52%,
rgba(255, 255, 255, .4) 77%, transparent 77%,
transparent
);
}

.markdown-body .progress-100plus .progress-bar {
background-color: #a6d796;
}

.markdown-body .progress-80plus .progress-bar {
background-color: #c6d796;
}

.markdown-body .progress-60plus .progress-bar {
background-color: #d7c896;
}

.markdown-body .progress-40plus .progress-bar {
background-color: #d7a796;
}

.markdown-body .progress-20plus .progress-bar {
background-color: #d796a6;
}

.markdown-body .progress-0plus .progress-bar {
background-color: #c25f77;
}

.markdown-body .candystripe-animate .progress-bar{
-webkit-animation: animate-stripes 3s linear infinite;
-moz-animation: animate-stripes 3s linear infinite;
animation: animate-stripes 3s linear infinite;
}

@-webkit-keyframes animate-stripes {
0% {
background-position: 0 0;
}

100% {
background-position: 60px 0;
}
}

@-moz-keyframes animate-stripes {
0% {
background-position: 0 0;
}

100% {
background-position: 60px 0;
}
}

@keyframes animate-stripes {
0% {
background-position: 0 0;
}

100% {
background-position: 60px 0;
}
}

.markdown-body .gloss .progress-bar {
box-shadow:
inset 0 4px 12px rgba(255, 255, 255, .7),
inset 0 -12px 0 rgba(0, 0, 0, .05);
}

/* Multimarkdown Critic Blocks */
.markdown-body .critic_mark {
background: #ff0;
}

.markdown-body .critic_delete {
color: #c82829;
text-decoration: line-through;
}

.markdown-body .critic_insert {
color: #718c00 ;
text-decoration: underline;
}

.markdown-body .critic_comment {
color: #8e908c;
font-style: italic;
}

.markdown-body .headeranchor {
font: normal normal 16px octicons-anchor;
line-height: 1;
display: inline-block;
text-decoration: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

.headeranchor:before {
content: ‘\f05c‘;
}

.markdown-body .task-list-item {
list-style-type: none;
}

.markdown-body .task-list-item+.task-list-item {
margin-top: 3px;
}

.markdown-body .task-list-item input {
margin: 0 4px 0.25em -20px;
vertical-align: middle;
}

/* Media */
@media only screen and (min-width: 480px) {
.markdown-body {
font-size:14px;
}
}

@media only screen and (min-width: 768px) {
.markdown-body {
font-size:16px;
}
}

@media print {
.markdown-body * {
background: transparent !important;
color: black !important;
filter:none !important;
-ms-filter: none !important;
}

.markdown-body {
font-size:12pt;
max-width:100%;
outline:none;
border: 0;
}

.markdown-body a,
.markdown-body a:visited {
text-decoration: underline;
}

.markdown-body .headeranchor-link {
display: none;
}

.markdown-body a[href]:after {
content: " (" attr(href) ")";
}

.markdown-body abbr[title]:after {
content: " (" attr(title) ")";
}

.markdown-body .ir a:after,
.markdown-body a[href^="javascript:"]:after,
.markdown-body a[href^="#"]:after {
content: "";
}

.markdown-body pre {
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word;
}

.markdown-body pre,
.markdown-body blockquote {
border: 1px solid #999;
padding-right: 1em;
page-break-inside: avoid;
}

.markdown-body .progress,
.markdown-body .progress-bar {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}

.markdown-body .progress {
border: 1px solid #ddd;
}

.markdown-body .progress-bar {
height: 22px;
border-right: 1px solid #ddd;
}

.markdown-body tr,
.markdown-body img {
page-break-inside: avoid;
}

.markdown-body img {
max-width: 100% !important;
}

.markdown-body p,
.markdown-body h2,
.markdown-body h3 {
orphans: 3;
widows: 3;
}

.markdown-body h2,
.markdown-body h3 {
page-break-after: avoid;
}
}
-->

原文地址：https://www.cnblogs.com/ys-python/p/11247392.html

时间： 2024-10-31 15:08:17

常用模板标签的相关文章

python Django教程 之模板渲染、循环、条件判断、常用的标签、过滤器

python3.5 manage.py runserver python Django教程 之模板渲染.循环.条件判断.常用的标签.过滤器 一.Django模板渲染模板 注: 本节代码是基于 Django 1.8,但 Django 1.4 - Djagno 1.9 操作流程也是一样的. 后文给出示例代码可以在 Django 1.4.x 到 Django 1.9.x 上运行. 不过还是强调一点,一点要动手敲代码!不要偷懒哦,动手才能学到真东西. 1. 创建一个 zqxt_tmpl 项目,和一个 名

Vue常用模板语法

常用模板语法 本篇将在上一篇的基础上记录文本渲染.表达式.过滤器以及常用指令的简单用法. 一.文本渲染 Vue支持动态渲染文本,即在修改属性的同时,实时渲染文本内容.同时为了提高渲染效率,也支持只渲染一次,即第一次渲染出文本后,文本内容不再跟随属性值的变化而变化. 实时渲染 1 <div class="row"> 2 <h2>文本 - 实时渲染</h2> 3 <input type="text" v-model="

dede模板标签以及dedetag.class.php模板类

dedecms里面有两个标签还是比较灵活的,一个是{dede:PHP} {/dede:PHP}另外一个是{dede:sql}标签,{dede:PHP}标签注释要用来在模板中写PHP代码的,{dede:sql}主要是用 来调用sql用的,下面就来介绍下这两个标签到底该如何使用.该文章是转自百度空间的一篇文章.{dede:sql}标签的用法sql标签可以称得上是个万能标签了,查询数据库将其输出,这里介绍一些关于这个标签的用法:1.用来输出统计内容,这个是不错的,举个例子,我们来统计下总共发了多少的文

freecms首页静态化以及模板标签

首页静态化代码: 在freeCMS的后台进行首页静态化时,首先会调用cn.freeteam.cms.action.HtmlAction里的indexDo方法,以下是代码: 很明显这里会用到siteService里的html方法: 在这里需要几个参数放到data里:site对象,contextpath--系统根路径,contextpathno--系统根路径不带最后一个“/”, 这些准备好后将context,data,以及模板路径.站点路径发送到createhtml方法, 在这里说一下模板路径以及站

django自定义过滤器及模板标签

创建一个模板库 不管是写自定义标签还是过滤器,第一件要做的事是创建模板库(Django能够导入的基本结构). 创建一个模板库分两步走: 第一,决定模板库应该放在哪个Django应用下. 如果你通过 manage.py startapp 创建了一个应用,你可以把它放在那里,或者你可以为模板库单独创建一个应用. 我们更推荐使用后者,因为你的filter可能在后来的工程中有用. 无论你采用何种方式,请确保把你的应用添加到 INSTALLED_APPS 中. 我们稍后会解释这一点. 第二,在适当的Dja

django “如何”系列4：如何编写自定义模板标签和过滤器

django的模板系统自带了一系列的内建标签和过滤器,一般情况下可以满足你的要求,如果觉得需更精准的模板标签或者过滤器,你可以自己编写模板标签和过滤器,然后使用{% load %}标签使用他们. 代码布局 自定义标签和过滤器必须依赖于一个django app,也就是说,自定义标签和过滤器是绑定app的.该app应该包含一个templatetags目录,这个目录一个和model.py,views.py在同一个层级,记得在该目录下建立一个__init__.py文件一遍django知道这是一个pyth

WordPress主题制作教程6：常用模版标签

在wordpress中,模板标签指一些字段,比如标题,内容,作者,发布日期,评论数等等,获取静态值和循环里面经常使用. 输出模板标签一般有两种方式:the_yourtag() 输出标签值和get_the_yourtag()获标签值通常来说,the_yourtag()==echo get_the_yourtag(); 常用模版标签: bloginfo('name'); 获取博客名字 bloginfo('template_directory'); 获取主题存放路径 bloginfo( 'styles

Django内置模板标签

Django内置标签总览 可以查询下表来总览Django的内置标签: 标签 说明 autoescape 自动转义开关 block 块引用 comment 注释 csrf_token CSRF令牌 cycle 循环对象的值 debug 调试模式 extends 继承模版 filter 过滤功能 firstof 输出第一个不为False的参数 for 循环对象 for … empty 带empty说明的循环 if 条件判断 ifequal 如果等于 ifnotequal 如果不等于 ifchange

django第四课 模板标签，继承与引用

pycharm 远程同步配置 会出问题 不自动同步 1.常用的模板标签 -作用是什么? -常用标签 总结:语法 {% tag %} {% endtag %} {% tag 参数 参数 %} 案例: views.py设置把里面的index 里面的students以表格形式显示 1 def index(request): 2 3 students = [ 4 {'id': 10, 'name': '张三', 'age': 18, 'sex': '男'}, 5 {'id': 11, 'name': '