Python入门自学进阶-Web框架——33、瀑布流布局与组合查询

最新推荐文章于 2024-05-01 17:32:06 发布
最新推荐文章于 2024-05-01 17:32:06 发布
阅读量446 收藏 2
点赞数
分类专栏： Python入门 文章标签： python 前端 html django Powered by 金山文档
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/kaoa000/article/details/129200563
版权

一、瀑布流，是指页面布局中，在显示很多图片时，图片及文字大小不相同，导致页面排版不美观

如上图，右边的布局，因为第一行第一张图片过长，第二行的第一张被挤到第二列了。示例：

def flow(request):
    user_list = [
        {'name': '张1三', 'src': '/static/image/1.jpg', 'company': '特事特办中国特色一公司','summary': '一群老油条烦死打法撒飞洒的飞洒烦死哒防守打法噶三群老油条烦死哒范德萨分散发士大夫士大夫是打发发防守打法烦死哒防守打法噶第三方三'},
        {'name': '张2三', 'src': '/static/image/1.jpg', 'company': '特事特办中国特色一公司','summary': '一群老油'},
        {'name': '张3三', 'src': '/static/image/1.jpg', 'company': '特事特办中国特色一公司','summary': '一群老油条烦分打发发防守打法撒飞洒的飞洒烦死哒防守打法噶第三'},
        {'name': '张4三', 'src': '/static/image/1.jpg', 'company': '特事特办中国特色一公司','summary': '一群老油条烦死哒范德萨分散发士大夫士大夫是打发发防守打法烦死哒防守打法噶第三方三'},
        {'name': '张5三', 'src': '/static/image/1.jpg', 'company': '特事特办中国特色一公司','summary': '一群老油条烦死哒范德萨分散发士大夫士大夫是打发发防守打法'},
        {'name': '张6三', 'src': '/static/image/1.jpg', 'company': '特事特办中国特色一公司','summary': '一群老油条烦死哒范洒的飞洒烦死哒防守打法噶第三方三'},
        {'name': '张7三', 'src': '/static/image/1.jpg', 'company': '特事特办中国特色一公司','summary': '一群老油条烦死哒范德萨分散发士大夫士大夫是打发发防守打噶第三方三'},
        {'name': '张8三', 'src': '/static/image/1.jpg', 'company': '特事特办中国特色一公司','summary': '一法撒飞洒的飞洒烦死哒防守打法噶第三方三'},
    ]
    return render(request,"flow.html",{'user_list':user_list})
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .container{
            width: 900px;
            margin: 0 auto;
        }
        .container .item{
            width: 300px;
            float: left;
        }
        .container .item img{
            width: 200px;
            height: 180px;
        }
        .container .item p{
            padding-left: 10px;
            padding-right: 40px;
        }
    </style>
</head>
<body>
    <div class="container">
        {% for row in user_list %}
            <div class="item">
                <img src="{{ row.src }}">
                <p>{{ row.name }}</p>
                <p>{{ row.summary }}</p>
            </div>
        {% endfor %}
    </div>
</body>
</html>

此时显示如下：

很不美观，解决方法，是先将页面分为三个div，让后让图片依次在三个div中排放。

纯静态HTML实现：

<div class="container">
        <div style="width: 900px;margin: 0 auto;">
            <div style="width: 280px;float: left;">

                <div class="item">
                    <img src="{{ user_list.0.src }}">
                    <p>{{ user_list.0.name }}1</p>
                    <p>{{ user_list.0.summary }}<br>fdsafdsafd<br>safsdafsd<br>afsdaff<br>assdf</p>
                </div>
                <div class="item">
                    <img src="{{ user_list.0.src }}">
                    <p>{{ user_list.0.name }}4</p>
                    <p>{{ user_list.0.summary }}<br>fdsafdsafd<br>safsdafsd<br>afsdaff<br>assdf</p>
                </div>
            </div>
            <div style="width: 280px;float: left;">
                <div class="item">
                    <img src="{{ user_list.0.src }}">
                    <p>{{ user_list.0.name }}2</p>
                    <p>{{ user_list.0.summary }}</p>
                </div>
                <div class="item">
                    <img src="{{ user_list.0.src }}">
                    <p>{{ user_list.0.name }}5</p>
                    <p>{{ user_list.0.summary }}<br>fdsafdsafd<br>safsdafsd<br>afsdaff<br>assdf</p>
                </div>
            </div>
            <div style="width: 280px;float: left;">
                <div class="item">
                    <img src="{{ user_list.0.src }}">
                    <p>{{ user_list.0.name }}3</p>
                    <p>{{ user_list.0.summary }}</p>
                </div>
            </div>

        </div>
    </div>

这就实现了瀑布流，使用模板渲染：最初想法如下

       <div style="width: 900px;margin: 0 auto;">
            {%  for row in user_list %}
            <div style="width: 300px;float: left;">
                {% if forloop.counter%3 == 1 %}   {# 这里出错 #}
                <div class="item">
                    <img src="{{ row.src }}">
                    <p>{{ row.name }}</p>
                    <p>{{ row.summary }}</p>
                </div>
                {% endif %}
            </div>
            <div style="width: 300px;float: left;">
                {% if forloop.counter%3 == 2 %}   {# 这里出错 #}
                <div class="item">
                    <img src="{{ row.src }}">
                    <p>{{ row.name }}</p>
                    <p>{{ row.summary }}</p>
                </div>
                {% endif %}
            </div>
            <div style="width: 300px;float: left;">
                {% if forloop.counter%3 == 0 %}   {# 这里出错 #}
                <div class="item">
                    <img src="{{ row.src }}">
                    <p>{{ row.name }}</p>
                    <p>{{ row.summary }}</p>
                </div>
                {% endif %}
            </div>
            {% endfor %}
        </div>

取模操作%无法在模板中使用，因为使用到了if语句，自定义标签不能用在模板if语句中，所以只能考虑使用过滤器filter：

<div class="container">
            <div style="width: 300px;float: left">
            {%  for row in user_list %}
                {% if forloop.counter|mymod:'3,1' %}
                <div class="item">
                    <img src="{{ row.src }}">
                    <p>{{ row.name }}{{ forloop.counter }}</p>
                    <p>{{ row.summary }}</p>
                </div>
                {% endif %}
            {% endfor %}
            </div>
            <div style="width: 300px;float: left;">
            {%  for row in user_list %}
                {% if forloop.counter|mymod:'3,2' %}
                <div class="item">
                    <img src="{{ row.src }}">
                    <p>{{ row.name }}{{ forloop.counter }}</p>
                    <p>{{ row.summary }}</p>
                </div>
                {% endif %}
            {% endfor %}
            </div>
            <div style="width: 300px;float: left;">
            {%  for row in user_list %}
                {% if forloop.counter|mymod:'3,0' %}
                <div class="item">
                    <img src="{{ row.src }}">
                    <p>{{ row.name }}{{ forloop.counter }}</p>
                    <p>{{ row.summary }}</p>
                </div>
                {% endif %}
            {% endfor %}
            </div>
        </div>
# 过滤器
from django import template

register = template.Library()

@register.filter
def mymod(v1,v2):
    n1,n2 = v2.split(',')

    if v1%int(n1) == int(n2):
        return True
    return False

以上是模板渲染，使用了多次的循环，效率不是很好。

使用JS实现，使用Ajax发送一个请求，得到数据，然后在js中进行余数的判断和前端的生成。

二、组合搜索/组合筛选

简单的组合搜索如下图：

建立相应的model：

from django.db import models
# Create your models here.

class Level(models.Model):
    name = models.CharField(max_length=32)

    def __str__(self):
        return self.name

class Category(models.Model):
    name = models.CharField(max_length=32)
    def __str__(self):
        return self.name

class Video(models.Model):
    lv = models.ForeignKey(Level,on_delete=models.DO_NOTHING)
    cg = models.ForeignKey(Category,on_delete=models.DO_NOTHING)

    title = models.CharField(verbose_name="标题",max_length=64)
    summary = models.CharField(verbose_name="简介",max_length=128)
    img = models.ImageField(verbose_name="图片",upload_to="./static/images/video")
    href = models.CharField(verbose_name="视频地址",max_length=256)

    create_date = models.DateTimeField(auto_now_add=True)

创建路由项，这里查询的条件组合在路由项中，如下：

path('video-<int:cg_id>-<int:lv_id>.html',views.video,name='video_alais'),

cg_id代表种类的id，lv_id代表级别的id

对应的视图函数：

def video(req,*args,**kwargs):
    condition = {}
    for k,v in kwargs.items():
        if v != 0:
            condition[k] = v
    print(condition)
    category_list = models.Category.objects.all()
    level_list = models.Level.objects.all()

    result = models.Video.objects.filter(**condition)
    return  render(req,'video.html',{
        'category_list':category_list,
        'level_list':level_list,
        'result':result,
        'arg_dict':kwargs,
    })

前端模板文件video.html：

{% load tagandfilter %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .filter a {
            display: inline-block;
            margin: 5px;
            padding: 3px 5px;
        }
        .filter a.active{
            background-color: brown;
            color: white;
        }
    </style>
</head>
<body>
    <h1>筛选条件</h1>
    <div class="filter">
        <div>
            {% total_tag arg_dict "cg_id" %}:
            {% for item in category_list %}
                {% categroy_tag item arg_dict %}
            {% endfor %}
        </div>
        <div>
            {% total_tag arg_dict "lv_id" %}:
            {% for item in level_list %}
                {% level_tag item arg_dict %}
            {% endfor %}
        </div>
    </div>

    <h1>查询结果</h1>
    <div class="content">
        {% for item in result %}
        <div style="width:180px;height:200px;float: left">
            <img width="150px" height="200px" src="{{ item.img }}">
            <p>{{ item.title }}</p>
            <p>{{ item.summary }}</p>
            <p>{{ item.create_date }}</p>
        </div>
        {% endfor %}
    </div>
</body>
</html>

模板中使用了自定义标签：

@register.simple_tag
def categroy_tag(obj,arg_dict):
    '''
    生成种类的A标签
    :param obj:
    :param arg_dict:
    :return:
    '''

    url = reverse("video_alais",kwargs={'cg_id':obj.id,'lv_id':arg_dict.get('lv_id')})

    if obj.id == arg_dict.get('cg_id'):
        tag = "<a class='active' href='%s'>%s</a>" %(url,obj.name)
        return mark_safe(tag)
    else:
        tag = "<a  href='%s'>%s</a>" %(url,obj.name)
        return mark_safe(tag)

@register.simple_tag
def level_tag(obj,arg_dict):
    '''
    生成级别的A标签
    :param obj:
    :param arg_dict:
    :return:
    '''
    url = reverse("video_alais", kwargs={'lv_id': obj.id, 'cg_id': arg_dict.get('cg_id')})
    if obj.id == arg_dict.get('lv_id'):
        tag = "<a class='active' href='%s'>%s</a>" %(url,obj.name)
        return mark_safe(tag)
    else:
        tag = "<a  href='%s'>%s</a>" %(url,obj.name)
        return mark_safe(tag)

@register.simple_tag
def total_tag(arg_dict,key):
    if key == 'cg_id':
        url = reverse("video_alais", kwargs={'cg_id': 0, 'lv_id': arg_dict.get('lv_id')})
    elif key == 'lv_id':
        url = reverse("video_alais", kwargs={'lv_id': 0, 'cg_id': arg_dict.get('cg_id')})
    else:
        url = ""
    tag = "<a  href='%s'>全部：</a>" %(url)
    return mark_safe(tag)

增加一个关联表：Direction，与种类表形成多对多关系：

class Direction(models.Model):
    name = models.CharField(max_length=32)
    d_2_c = models.ManyToManyField("Category")

使分类根据方向动态变化：大体如下

因为多了一个方向的选择项，路由项修改如下：

path('video2-<int:dr_id>-<int:cg_id>-<int:lv_id>.html',views.video2,name='video_alais2'),

视图函数views.video2：

def video2(req,*args,**kwargs):
    condition = {}
    dr_id = kwargs.get('dr_id')
    cg_id = kwargs.get('cg_id')
    lv_id = kwargs.get("lv_id")
    # 可能的请求：
    # 0-0-0.html 方向、分类、级别都是全部
    # 1-0-0.html 方向选择了1，分类、级别是全部，此时分类应该根据方向列出有哪些分类
    # 1-2-0.HTML 方向选择了1，分类选择了2，级别全部；分类先要根据方向列出可能的分类，在根据分类选择video
    #            还有一种可能，方向选择了1，而1方向对应的分类没有2，此时应该处理成分类为全部，即0

    direction_list = models.Direction.objects. all()
    level_list = models.Level.objects.all()

    if dr_id == 0:
        # 未选择方向
        category_list = models.Category.objects.all()
        if cg_id == 0:
            pass   # 未选择分类 - 未选择方向
        else:
            # 选择了分类 - 未选择方向
            models.Video.objects.filter(cg_id = cg_id)
            condition['cg_id'] = cg_id
    else:
        # 选择了方向，将方向对应的分类项查询出来，对象的集合，是QuerySet
        category_list = models.Category.objects.filter(direction=dr_id)
        # 选取其中的id字段对象集合
        v = category_list.values_list('id')
        # print(v.query)  # 打印出查询的SQL语句
        cg_id_list = list(zip(*v))[0]  # id字段集合形成元组，即（1,2,3）的样子
        if cg_id == 0:
            # 未选择分类 - 选择了方向
            # 这种情况下，选择的条件就是选择全部分类id在cg_id_list元组中的所有video
            # 即在此方向下的所有分类都要查询出来
            condition['cg_id__in'] = cg_id_list
        else:
            # 选择了分类，并且分类在cg_id_list中
            if cg_id in cg_id_list:
                condition['cg_id'] = cg_id
            else:  # 选择了分类，并且分类不在cg_id_list中，这时就选择全部cg_id_list的全部
                condition['cg_id__in'] = cg_id_list
                kwargs['cg_id'] = 0

    if lv_id != 0:  # 级别是单独的
        condition['lv_id'] = lv_id

    result = models.Video.objects.filter(**condition)  # 根据条件最终查询的video结果集合

    return  render(req,'video2.html',{
        'direction_list':direction_list,
        'category_list':category_list,
        'level_list':level_list,
        'result':result,
        'arg_dict':kwargs,
    })

前端模板video2.html

{% load tagandfilter %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .filter a {
            display: inline-block;
            margin: 5px;
            padding: 3px 5px;
        }
        .filter a.active{
            background-color: brown;
            color: white;
        }
    </style>
</head>
<body>
    <h1>筛选条件</h1>
    <div class="filter">
        <div>
            {% total_tag_2 arg_dict "dr_id" %}
            {% for item in direction_list %}
               <!-- if kwargs.dr_id = item.id
                    加入样式
                else：
                    没有样式
                -->
                {% dr_tag item arg_dict %}
            {% endfor %}
        </div>
        <div>
            {% total_tag_2 arg_dict "cg_id" %}
            {% for item in category_list %}
            {% cg_tag item arg_dict %}
            {% endfor %}
        </div>
        <div>
            {% total_tag_2 arg_dict "lv_id" %}
            {% for item in level_list %}
                {% lv_tag item arg_dict %}
            {% endfor %}
        </div>
    </div>

    <h1>查询结果</h1>
    <div class="content">
        {% for item in result %}
        <div style="width:180px;height:200px;float: left">
            <img width="150px" height="200px" src="{{ item.img }}">
            <p>{{ item.title }}</p>
            <p>{{ item.summary }}</p>
            <p>{{ item.create_date }}</p>
        </div>
        {% endfor %}
    </div>
</body>
</html>

自定义的标签：

@register.simple_tag
def dr_tag(obj,arg_dict):
    '''
    生成A标签
    :param obj:
    :param arg_dict:
    :return:
    '''
    url = reverse('video_alais2',kwargs={'dr_id':obj.id,'cg_id':arg_dict.get('cg_id'),'lv_id':arg_dict.get('lv_id')})
    if obj.id == arg_dict.get('dr_id'):
        tag = "<a class='active' href='%s'>%s</a>" %(url,obj.name)
        return mark_safe(tag)
    else:
        tag = "<a  href='%s'>%s</a>" %(url,obj.name)
        return mark_safe(tag)

@register.simple_tag
def cg_tag(obj,arg_dict):
    '''
    生成A标签
    :param obj:
    :param arg_dict:
    :return:
    '''
    url = reverse('video_alais2',kwargs={'dr_id':arg_dict.get('dr_id'),'cg_id':obj.id,'lv_id':arg_dict.get('lv_id')})
    if obj.id == arg_dict.get('cg_id'):
        tag = "<a class='active' href='%s'>%s</a>" %(url,obj.name)
        return mark_safe(tag)
    else:
        tag = "<a  href='%s'>%s</a>" %(url,obj.name)
        return mark_safe(tag)

@register.simple_tag
def lv_tag(obj,arg_dict):
    '''
    生成A标签
    :param obj:
    :param arg_dict:
    :return:
    '''
    url = reverse('video_alais2',kwargs={'dr_id':arg_dict.get('dr_id'),'cg_id':arg_dict.get('cg_id'),'lv_id':obj.id})
    if obj.id == arg_dict.get('lv_id'):
        tag = "<a class='active' href='%s'>%s</a>" %(url,obj.name)
        return mark_safe(tag)
    else:
        tag = "<a  href='%s'>%s</a>" %(url,obj.name)
        return mark_safe(tag)

@register.simple_tag
def total_tag_2(arg_dict,key):
    if key == 'dr_id':
        url = reverse("video_alais2", kwargs={'dr_id':0,'cg_id': arg_dict.get('cg_id'), 'lv_id': arg_dict.get('lv_id')})
    elif key == 'cg_id':
        url = reverse("video_alais2", kwargs={'dr_id': arg_dict.get('dr_id'), 'cg_id': 0, 'lv_id': arg_dict.get('lv_id')})
    elif key == 'lv_id':
        url = reverse("video_alais2", kwargs={'dr_id':arg_dict.get('dr_id'),'lv_id': 0, 'cg_id': arg_dict.get('cg_id')})
    else:
        url = ""
    if arg_dict.get(key) == 0:
        tag = "<a  class='active' href='%s'>全部：</a>" %(url,)
    else:
        tag = "<a  href='%s'>全部：</a>" % (url,)
    return mark_safe(tag)

主要的环节是逻辑上根据方向、分类、级别的选择，动态显示各个项，然后在综合条件下选择出video。

kaoa000
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
千锋Python进阶教程-Web开发之Flask框架从入门到精通
07-22
flask框架的高级课程，带你玩转web开发领域，网站后台的搭建，APP接口的开发。扣丁学堂Python技术交流群：279521237。 资源太大，传百度网盘了，链接在附件中，有需要的同学自取。
python3开发进阶-Django框架的Form表单系统和基本操作.docx
04-19
python3开发进阶-Django框架的Form表单系统和基本操作
西游之路——python全栈——瀑布流
aoling5796的博客
09-14 121
############################### class Picture(models.Model): src = models.ImageField(verbose_name='图片路径', upload_to='./static/images/picture/') title = models.CharField(verbose_na...
【python】瀑布流
Jimy_Fengqi
01-28 5653
  前端HTML {% load tags %} &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&gt; &lt;style&gt;
如何使用Python 绘制惊艳众人的瀑布图_python 瀑布图(1)
最新发布
2401_84140506的博客
05-01 14
我们在看视频学习的时候，不能光动眼动脑不动手，比较科学的学习方法是在理解之后运用它们，这时候练手项目就很适合了，只是里面的项目比较多，水平也是参差不齐，大家可以挑自己能做的项目去练练。这是我花了几天的时间去把Python所有方向的技术点做的整理，形成各个领域的知识点汇总，它的用处就在于，你可以按照上面的知识点去找对应的学习资源，保证自己学得较为全面。相反，我们可以很容易地看到，按x轴正方向的连贯性顺序显示数据，并且黄色条显示减量，红色条显示增量。最近我才对这些路线做了一下新的更新，知识体系更全面了。
python50-瀑布流
weixin_34221775的博客
04-03 161
1.models.py from django.db import models # Create your models here. class Img(models.Model): src = models.FileField(max_length=32,verbose_name='图片路径',upload_to='static/upload') title = models...
web：瀑布流布局
weixin_34161029的博客
11-21 114
2019独角兽企业重金招聘Python工程师标准>>> ...
Intermediate Python - Python进阶-zh-v1.31
08-03
简介序序这是本Intermediate Python 的中译本, 谨以此献给进击的 Python 和 Python 程序员们!这是次团队建设、次尝鲜、次对我的提
Python 基础文档 详细入门文档（入门到进阶--很全面）
08-28
之前花钱报的网课 Python基础+案例 1、Python之操作系统.doc 2、python发展和对比.doc 3、环境搭建.docx 4、python的基础数据类型.doc 5、控制流程语句.doc 6、python运算符.docx 7、python的字符串.doc 7、列表-...
课程源码《Django入门到进阶-适合Python小白的系统课程》
04-21
这门课程适合Python初学者，通过Django框架学习Web开发的基础和进阶知识： 入门与环境配置：介绍Django框架及开发环境配置。 路由与视图：创建视图和路由，学习参数设置和扩展知识。 模板使用：详细讲解Django模板...
masonry 瀑布流框架 精美示例
05-17
很好用的瀑布流示例，可以很方便的集成到你的项目中，亲测完美运行，示例精美。
json数组转化为list-Python入门进阶教程-JSON操作.pdf
06-11
json数组转化为list_Python⼊门进阶教程-JSON操作 「关注我，和我⼀起放下灵魂，让灵魂去搬砖。」 Python JSON操作 操作 Python版本3.8.0，开发⼯具：Pycharm 什么是JSON？ 什么是JSON？ JSON 的全称是 JavaScript ...
Python从入门到进阶知识手册1885页.pdf
11-14
Python从入门到进阶知识手册1885页Python从入门到进阶知识手册1885页Python从入门到进阶知识手册1885页Python从入门到进阶知识手册1885页Python从入门到进阶知识手册1885页Python从入门到进阶知识手册1885页Python从...
【Python入门自学笔记专辑】——面向对象编程
01-20
【Python入门自学笔记专辑】——面向对象编程 前言 ​ 面相对象是Python的重要特性，继承了C++的类风格，在Python中的一切数据类型都是面向对象的。本章主要介绍Python的面向对象编程。 面向对象： ​ 什么是OOP...
Python从入门到精通视频-Web服务器案例-Scrapy爬虫框架-Django框架-Python高级实
11-21
python-:54.8GB资料 经典、难点详细解析 Web服务器案例 Scrapy爬虫框架 python软件 Python基础班 python电子书 Django框架 05 精选Python好书 02 进阶实战 Python高级开发实战视频（共14集） 02 基础提高 ...
web之瀑布流布局
祥子的博客
06-19 602
组件分享：http://pan.baidu.com/s/1eShoNx4 参考网站：http://www.wookmark.com/about/api 瀑布流布局非常适合大量图片的展示，一改过去裁剪图片尺寸统一的排版，每张图片都能完全展示，并错落有致，让人眼前一亮。 注意事项： 项目中的 img 元素的 width 和 height 属性需要写，否则定位会不准确。（可以用 Ja
python 流式计算框架_python GUI框架pyqt5如何对图片进行流式布局（瀑布流flowlayout）...
weixin_39794213的博客
12-11 324
流式布局流式布局，也叫做瀑布流布局，是网页中经常使用的一种页面布局方式，它的原理就是将高度固定，然后图片的宽度自适应，这样加载出来的图片看起来就像瀑布一样整齐的水流淌下来。pyqt流式布局那么在pyqt5中我们怎么使用流式布局呢？pyqt没有这个控件，需要我们自己去封装，下面是流式布局的封装代码。class FlowLayout(QLayout):def __init__(self, parent...
[Web] 简单瀑布流布局实现
诺尔的博客
02-14 1184
使用少量 JS 和 CSS 实现的瀑布流布局
web学习-瀑布流布局(1)
shangxiaommm的专栏
12-15 419
在mooc网上学习了瀑布流布局的实现,自己就记录了一下,留作一个笔记^.^瀑布流样式在页面中有大大小小的box,box的宽度相同,高度不同,竖直排列成N列,当滚动条向下面滚动的时候自动加载box,形成瀑布流基本结构(1)html结构:<body> <div id="warp"> <div class='box'><div class='pic'><img></div><div> </div> <
python-web框架
09-06
Python中常用的Web框架有Flask、Tornado和Django。Flask是一个轻量级的Web框架，类似于Web.py，具有异步非阻塞IO的处理方式。 Tornado是Python界中非常出名的一款Web框架，也属于轻量级的框架，被广泛用于构建高性能...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值