添加include文件路径_include标签—引用文件路径

今天给大家讲解的是include标签,在打代码的时候总会出现一些重复的样式,这个时候就可以用include标签来减少打代码的次数。

f634de1622f8c408d293950848fbf386.png


文件名index.html,代码:

{% from 'macros/forms.html' import input %}    宏
新闻 音乐 贴吧 视频
账号 {{ input(placeholder="请输入账号") }} 密码 {{ input(type="password", placeholder="请输入密码") }} {{ input(type="submit", value="提交") }}

现在考虑这样一个问题,如果页面头部和底部是很多页面要用的样式,那么如果在每一个新的文件中都要复制相同的代码肯定不是我们希望的,这时候就可以用到include标签了:

用法

{% include '引用文件路径' %}

用include前提是把相同的代码先提取出来,所以我们将对应的代码先提取成文件:

文件结构:

1a287dde53f13775ecf9c1bead48f7a6.png

headers.html

新闻 音乐 贴吧 视频

footers.html

将公共部分提取出以后在调用的地方只需要用include标签调用即可:

index.html

{% from 'macros/forms.html' import input %}    宏    {% include 'index/headers.html' %}    
账号 {{ input(placeholder="请输入账号") }} 密码 {{ input(type="password", placeholder="请输入密码") }} {{ input(type="submit", value="提交") }} {% include 'index/footers.html' %}

如果还有一个详情页,那么只需要:

detail.html

    Detail    {% include 'index/headers.html' %}        

这是详情页

{% include 'index/footers.html' %}

显示

79efa07b8cd482bf2ed26900c324bd7d.png

如果对接口、性能、自动化测试、面试经验交流等感兴趣的,可以关注我的头条号,我会不定期的发放免费的资料,这些资料都是从各个技术网站搜集、整理出来的,如果你有好的学习资料可以私聊发我,我会注明出处之后分享给大家。欢迎分享,欢迎评论,欢迎转发。需要资料的同学可以关注小编+转发文章+私信【测试资料】

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值