2.1template模板
Flask使用了jinja2模板技术,支持变量,循环,与分支以及自定义标签,支持点"."语法,如:
-
对象.属性
-
列表.索引下标
-
字典.key
模板的html文件存放在templates目录中,templates目录下的所有html网页文件,内部都可以使用jinja2模板的语法,但是html文件必须在view视图函数中通过render_template("xx.html")渲染,即渲染模板文件就是解析模板语法
2.1.1模板过滤器
过滤器主要针对模板中变量的数据进行处理,如日期的格式化,字符串格式化,大小写转换以及列表元素的提取等处理.
2.1.1.1常用的过滤器:
-
字符串过滤器
-
capitalize只有第一个首字母大写
-
title每个单词的首字母大写
-
upper 大写转换
-
lower小写转换
-
format格式化字符串,类似于%s格式化
-
trim删除两边的空格,类似于字符串的strip()函数
-
列表过滤器
-
unique去掉重复的元素
-
join使用指定字符,连接可迭代对象中每一个元素
-
last读取最后一个元素
-
first读取第一个元素
-
slice切分指定元素个数的多个子列表
-
rendom随机读取列表中的某个元素
-
sort排序
-
list将生成器,可迭代对象转换成list
-
安全性过滤器
-
striptags删除字符串所有html标签(开始,结束)
-
safe渲染字符串的html标签,不会进行escape转换
-
make_safa
-
make_unsafa
-
数值过滤器
-
int 转成int
-
float 转成float
-
filesizeformat按文件大小的格式转换
-
round 四舍五入method="conmmon | ceil | floor"
2.1.1.2自定义过滤器
如果提供的过滤器不满足现有的需求,可以自定义过滤器
# 自定义模板过滤器
@app.template_filter('datetime')
def template_filter
2.1.2布局模板标签
又称之为结构标签,设计整体页面,如将页面分为上左右下四部分,在子页面中可以继续布局的模板文件,有针对性的实现那一部分,如只实现右边结构的部分
创建base.html模板文件,声明页面结构
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{% block title %} 主页 {% endblock %}</title>
</head>
<body>
{% block content%}
{% endblock %}
</body>
</html>
{% block title %} {% endblock %}声明块区域,它的结构被定义title名称
{% block content%}{% endblock %}声明content内容显示的块区域
再创建index.html,此页面不需要像base.html那样,将完整的标签写出来,只需要继承base.thml,再使用{% block title %} {% endblock %}可以填充base.html页面的内容.
{% extends "base.html" %}
{% block title %}
这是我的主页
{% endblock %}
{% block content%}
<h3>测试block结构标签</h3>
{% endblock %}
如果index.html又被其他子页面继承,在子页面填充的内容会覆盖父一级填充块的内容,如果想保留父填充块的内容,则在{% block %}{% endblock %}两个标签之间增加{{ super() }}
{% extends "index2.html" %}
{% block title %}
第三级标题-主页
{% endblock %}
{% block content %}
{{ super() }}
<h4>以后在此显示详情内容</h4>
{% endblock %}
可以使用{% include "500.html" %}标签指定网页内容填充到当前位置.
{% block content %}
{{ super() }}
<h4>以后在此显示详情内容</h4>
{% include "500.html" %}
{% endblock %}
include 和 extends的区别:
-
include导入整个网页,但是不能进行修改
-
extend只是继承网页,修改感兴趣的block
2.1.3模板宏标签
可以在html文件中使用{% macro 函数名() %}定义宏函数,它用户生成特定的html标签,而且在之后可以重复使用
如在macro.html,内容如下:
{% macro menu() %}
<ul>
<li>用户管理</li>
<li>库存管理</li>
<li>角色管理</li>
</ul>
>
{% endmacro %}
在index.html中使用时,需要使用{%from %}标签将宏函数导入到当前模板中
{% from "404.html" import menu %}
{{ menu() }}
2.2静态资源文件
flask默认情况下指定在static目录中,访问路径也是/static,可以在创建Flask对象时候,指定static_folder和static_url_path两个参数
static_folder指定静态资源文件存放的目录,一般情况下,静态资源存放css,js,图片素材,字体等
static_url_path指定静态资源文件访问的url路径,默认是"/static".如指定"/s",针对static目录下的css下的my.css样式,访问完整路径url应该是:http://localhost:5000/s/css/my.css
例:修改静态文件资源路径
方法1:正常Flask对象时配置
app = Flask(__name__, static_folder='static',static_url_path='/s')
static_url_path='files' 是修改静态文件资源访问路径
![](https://i-blog.csdnimg.cn/blog_migrate/7cf9364b1b9ffcb7532655a3456dfe08.png)
static_folder='/f' 是修改静态文件资源存放的路径,默认是static
修改后访问路径http://localhost:5000/f/images/068-6.jpg
模板
模板文件用来渲染html页面
1创建模板文件在static下创建css文件夹,在css文件夹下创建模板文件my.css
![](https://i-blog.csdnimg.cn/blog_migrate/54ae8f3808d5b3de33c4735dda9d4dbf.png)
-
html文件加载css文件渲染页面
![](https://i-blog.csdnimg.cn/blog_migrate/5eb387cd8767e89aefa008f683c63c33.png)