django网页渲染
模板标签种类
{% for blog in blog_list %}
<h2>{{ blog.title }}</h2>
<p>{{ blog.timestamp }}</p>
<p>{{ blog.body }}</p>
{% endfor %}
#变量标签用{{}}来表示
#块级标签用{%%} 来表示
模板继承block
{% block content %}{%endblock%}这个部分,会被替换为集成页面{% extends "xx.html"%}{%endblock%}中级的内容。
content是个标签,也可以是title,css,js等。
原则是,一旦发现在页面中有大量重复内容需要复制黏贴,就应该使用模板。
{% block content %}
{%endblock%}
#在base.html基础模板文件里,在内容部分加上命名块标签
{% extends "blog/base.html"%}
{% block content %}
{% for blog in blog_list %}
<h2>{{ blog.title }}</h2>
<p>{{ blog.timestamp }}</p>
<p>{{ blog.body }}</p>
{% endfor %}
{%endblock%}
#在内容页面只要继承该模板,该页面就会使用模板风格
文件包含include
<!-- include left -->
{% include 'base/left_menu.html' %}
<!-- include heder -->
{% include 'base/head_menu.html' %}
<!--right content-->
<div class="right_col" role="main">
{% block content %}{% endblock %}
</div>
<!-- include footer -->
{% include 'base/foot_menu.html' %}#}
#在这段代码中,几个菜单都是分离出去的,这样提高了可读性
{% load static %}
<script src="{% static 'js/jquery.min.js' %}"></script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>
<script src="{% static 'js/custom.min.js' %}"></script>
<script src="{% static 'js/icheck.min.js' %}"></script>
<script src="{% static 'js/sweetalert/sweetalert.min.js' %}"></script>
#在setting中设定static文件目录,然后在html文件头load static的话,下面可以直接用{% static xx%}来调用static文件。
#如果没有,就要用文件路径去调用static文件
{% url 'index' %}
<li><a href="{% url 'index' %}">控制台</a></li>
#在url中为url设置name属性后,可以直接调用name,而不需要使用url
{{ request.user }}
在网页中需要显示当前登录账户的用户名,可以直接用此渲染
列表嵌套字典for循环
<table border="1">
<thead>
<th >name</th>
<th>age</th>
<th>email</th>
</thead>
<tbody>
{% for dict in user_list %}
<tr>
<td>{{ dict.name }}</td>
<td>{{ dict.age }}</td>
<td>{{ dict.email }}</td>
</tr>
{% endfor %} </tbody>
</table>
2 字典嵌套字典for循环
<table border="1">
<thead>
<th >name</th>
<th>tally</th>
</thead>
<tbody>
{% for name,tally in user_dict.items %}
<tr>
<td>{{ name }}</td>
<td>{{ tally }}</td>
</tr>
{% endfor %}
</tbody>
</table>
django网页渲染的更多相关文章
- wkhtmltopdf是一个使用webkit网页渲染引擎开发的用来将 html转成 pdf的工具
wkhtmltopdf是一个使用webkit网页渲染引擎开发的用来将 html转成 pdf的工具,可以跟多种脚本语言进行集成来转换文档. 官网地址 http://wkhtmltopdf.org/ gi ...
- webkit技术--网页渲染原理
Webkit渲染 Webkit 是苹果发起的一个开源项目,后来谷歌用这个项目以 webkit 创建了一个新的项目 Chromium,我们平常用的 Chrome 浏览器一般都是基于 Chromium 开 ...
- 关于Django ModelForm渲染时间格式问题
关于Django ModelForm渲染时间格式问题 直接定义DateTimeInput或者DateTimeFile是不行的,渲染在html页面中的仍然是Input text类型 解决办法:自定义小部 ...
- Django—模板渲染
参考文档: http://www.cnblogs.com/fnng/p/4373108.html https://code.ziqiangxuetang.com/django/django-intro ...
- 【7】Django网页视图模板处理
天下难事必作於易.天下大事必作於细.是以圣人终不为大,故能成其大 --老子<道德经> 本节内容 HTML页面的渲染 使用页面模板 异常处理 超链接路径处理 路由命名空间 1. HTML页面 ...
- Django模板渲染——(二)
模板标签 模板是由HTML代码和一些逻辑控制代码组成的,逻辑控制代码除了前面介绍的变量和过滤器,还要一个非常重要的模板标签.模板标签的语法规则是{% tag %},模板标签在渲染的过程中能提供任意的逻 ...
- Django动态渲染多层菜单
为后续给菜单设置权限管理方便,通过给页面模版菜单动态渲染,通过数据菜单表进行匹配需要渲染的菜单 #Django表结构 class Menus(models.Model): name = models. ...
- 关于Django模板渲染一个很重要的用途
一般情况下我们在模板利用django的for标签循环生成html代码时,可以同时生成形如: "{% url 'dormitory:hygiene_detail' pk={{ id }} %} ...
- 理解WebKit和Chromium: 网页渲染的基本过程
转载请注明原文地址:http://blog.csdn.net/milado_nju ## 概述 前面介绍了一些渲染引擎的功能,包括网络,资源加载,DOM树,RenderObject树等等,但是,给人以 ...
随机推荐
- 关于Widget预览图的改动
在做项目时候,由于常常不带GPS功能.所以在有些细节上须要做处理,当中之中的一个就是.快捷开关的预览图和实际效果图的差异 在我们快捷开关的预览图中,总是能够看到五个快捷开关,事实上就包含GPS信息 而 ...
- C++中extern “C”含义深层探索(在原作的基础上修改) .
1. 引言 C++ 语言的创建初衷是“a better C” ,但是这并不意味着C++ 中类似C 语言的全局变量和函数所采用的编译和连接方式与C 语言完全相同.作为一种欲与C 兼容的语言,C++ 保留 ...
- Python 004- 利用图灵小机器人来搭建微信聊天自动回复机器人
实现步骤: 1.获取微信的使用权,即python脚本能控制微信收发信息. 2.python脚本收到聊天信息后,要对该信息进行处理,返回机器人的回应信息. 一二两步要用到wxpy库里的各种组件来收发信息 ...
- Delphi之萝莉调教篇
本文纯属技术交流.如果各位看官想与小生一起探讨萝莉的问题的话...PM我吧 关于Delphi的萝莉调教技术,很久以前就有大牛做过了...其实技术早掌握了只是觉得太无聊~估计大家也都会于是就没有写~既然 ...
- httpd2.4.27rpm包制作
http2.4.27 rpm包制作1.安装rpm-buildyum -y install rpm-build2.使用普通用户创建spec规则文件su - lxhvim httpd.spec Name: ...
- 自制简单的range(Vue)
废话不多说先上成果图 实现思路 主要分界面与逻辑两大块 界面分为5个部分 左滑块长度 左内容位置 中间长度 右滑块长度 右内容位置 逻辑 touch3个事件 各滑块长度及位置计算 选中时变色 具体实现 ...
- Vue源码探究-源码文件组织
Vue源码探究-源码文件组织 源码探究基于最新开发分支,当前发布版本为v2.5.17-beta.0 Vue 2.0版本的大整改不仅在于使用功能上的优化和调整,整个代码库也发生了天翻地覆的重组.可见随着 ...
- model.js
var Model = { inherited: function () {}, created: function () {}, prototype: { init: function (attrs ...
- 修改u-boot的开机logo及显示过程【转】
本文转载自;http://blog.csdn.net/voice_shen/article/details/6789424 [ u-boot: Git://git.denx.de/u-boot.git ...
- WPF之Binding深入探讨 转载:http://blog.csdn.net/fwj380891124/article/details/8107646
1,Data Binding在WPF中的地位 程序的本质是数据+算法.数据会在存储.逻辑和界面三层之间流通,所以站在数据的角度上来看,这三层都很重要.但算法在3层中的分布是不均匀的,对于一个3层结构的 ...