python include标签的使用方式及说明

 更新时间:2023年03月02日 11:44:05   作者:现在叫阿汤哥  
这篇文章主要介绍了python include标签的使用方式及说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

include标签如何使用?

include标签的使用

在讲python include标签使用之前,我们新建一个include_demo项目

截图如下

项目新建好了,再在templates文件下新建一个index.html文件,代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        *{margin:0;padding:0;}
        ul{list-style: none;}
        a{text-decoration: none;
            color: #ffffff;}
        nav,footer,.main{width:1000px; height:40px; margin:0 auto;}
        ul{width: 1000px; height:40px; line-height: 40px;
            background-color:#000000;}
        li{width:120px; height:40px; line-height:40px; text-align: center;
        float:left;}
        .main{clear:both; line-height:40px; background-color:pink;}
        footer{height:40px;  background-color: green;}
    </style>
</head>
<body>
 
        <nav>
            <ul>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >首页</a></li>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >关于我们</a></li>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >产品中心</a></li>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >新闻中心</a></li>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >服务宗旨</a></li>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >联系我们</a></li>
            </ul>
        </nav>
        <div class="main">
            网站首页主体部分
        </div>
       <footer>
            网站首页footer部分
       </footer>
 
</body>
</html>

然后在include_demo.py页面渲染一下index模板文件,代码如下:

from flask import Flask,render_template
 
app = Flask(__name__)
 
@app.route('/')
def hello_world():
    return render_template("index.html")
 
 
if __name__ == '__main__':
    app.run(debug=True)

运行include_demo.py文件,运行结果如下:

在这里主要是为了方便讲解include标签,所有没太注重前端页面部分。

通过上面index.html文件就能发现,我将公共和私有代码部分都在一块,假设网站有几十个页面,我将所有公共代码和私有代码

都放一块,如果有一天要修改某个公共代码块,哪就得修改几十个页面,那将是件非常麻烦的事。为了方便管理项目,我们将页面公共、私有代码部分抽取出来。

我们新建一个header.html文件,把css样式及nav标签内容复制到header.html页面中。

代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        *{margin:0;padding:0;}
        ul{list-style: none;}
        a{text-decoration: none;
            color: #ffffff;}
        nav,footer,.main{width:1000px; height:40px; margin:0 auto;}
        ul{width: 1000px; height:40px; line-height: 40px;
            background-color:#000000;}
        li{width:120px; height:40px; line-height:40px; text-align: center;
        float:left;}
        .main{clear:both; line-height:40px; background-color:pink;}
        footer{height:40px;  background-color: green;}
    </style>
</head>
<body>
      <nav>
            <ul>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >首页</a></li>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >关于我们</a></li>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >产品中心</a></li>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >新闻中心</a></li>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >服务宗旨</a></li>
                <li><a href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >联系我们</a></li>
            </ul>
        </nav>
</body>
</html>

然后新建一个footer.html文件,把footer标签中的内容复制到该文件中。

代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
     <footer>
            网站首页footer部分
     </footer>
     </footer>
</body>
</html>

我们在运行主app文件,结果如下:

(^-^),为啥没有居中,背景色也不见了??因为我们没有把样式引入进来(嗯,页面太丑了,没法看了,赶紧关了!!)

OK!我们将公共代码抽取出来后。记得在index.html文件中用include标签导入header、footer代码块,代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
   {% include "header.html" %}
        <div class="main">
            网站首页主体部分
        </div>
    {% include "footer.html" %}
</body>
</html>

再运行主app文件,结果如下:

嗯,结果是不是和之前一样,对吧!

通过上面例子,相信大部分小伙伴都明白了include标签的作用及用法。总之一句话,include标签的作用就相当于把抽取的代码复制到当前页面中。

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Python基于pygame实现的弹力球效果(附源码)

    Python基于pygame实现的弹力球效果(附源码)

    这篇文章主要介绍了Python基于pygame实现的弹力球效果,涉及pygame图形动态操作的相关的技巧,并附带了完整的源码供读者下载参考,需要的朋友可以参考下
    2015-11-11
  • Python字符串逆序的实现方法【一题多解】

    Python字符串逆序的实现方法【一题多解】

    今天小编就为大家分享一篇关于Python字符串逆序的实现方法【一题多解】,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧
    2019-02-02
  • Python读取文件比open快十倍的库fileinput

    Python读取文件比open快十倍的库fileinput

    fileinput是Python的内置模块,但不少人对它都是陌生的。今天把fileinput的所有的用法、功能进行详细的讲解,并列举一些非常实用的案例,对于理解和使用它可以说完全没有问题
    2021-10-10
  • Python快速实现一键抠图功能的全过程

    Python快速实现一键抠图功能的全过程

    你有没想过,Python也能成为这样的一种工具:在只有一张图片,需要细致地抠出人物的情况下,能帮你减少抠图步骤,这篇文章主要给大家介绍了关于Python快速实现一键抠图功能的相关资料,需要的朋友可以参考下
    2021-06-06
  • Python多进程加锁的实现

    Python多进程加锁的实现

    很多时候,我们需要在多个进程中同时写一个文件,如果不加锁机制,就会导致写文件错乱,本文主要介绍了Python多进程加锁的实现,文中通过示例代码介绍的非常详细,感兴趣的可以了解一下
    2023-07-07
  • 基于Python制作简易的windows修改器

    基于Python制作简易的windows修改器

    现在应该大部分人都使用win11系统吧,win11其实挺好用哈,只是有一点不好用,就是右键的菜单,今天做个小程序,就是应该修改win11的一个应用程序,感兴趣的可以了解一下
    2022-08-08
  • Python3 扫描库文件并获取版本号信息的操作方法

    Python3 扫描库文件并获取版本号信息的操作方法

    在 C/C++ 开发中使用了第三方库,具体说是 .a, .lib, .dll 等文件,想通过 Python 查询出这些文件中的版本号信息,下面小编给大家带来了Python3中扫描库文件并获取版本号信息的知识,需要的朋友可以参考下
    2023-05-05
  • Python远程桌面协议RDPY安装使用介绍

    Python远程桌面协议RDPY安装使用介绍

    这篇文章主要介绍了Python远程桌面协议RDPY安装使用介绍,本文讲解了RDPY的安装、RDPY的简单使用两部份内容,需要的朋友可以参考下
    2015-04-04
  • 详解python函数的闭包问题(内部函数与外部函数详述)

    详解python函数的闭包问题(内部函数与外部函数详述)

    这篇文章主要介绍了python函数的闭包问题,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-05-05
  • python进阶教程之模块(module)介绍

    python进阶教程之模块(module)介绍

    这篇文章主要介绍了python进阶教程之模块(module)介绍,本文讲解了基础知识、引用方法、搜索的路径、模块包等知识,需要的朋友可以参考下
    2014-08-08

最新评论