码迷,mamicode.com
首页 > 编程语言 > 详细

【python】瀑布流

时间:2017-02-08 13:12:01      阅读:160      评论:0      收藏:0      [点我收藏+]

标签:false   .com   前端   ack   code   util   container   ring   type   

 

 

 

前端HTML

{% load tags %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>

        .container{
            width: 900px;
            margin: 0 auto;
            background-color: antiquewhite;
        }
        .container .item{
            width: 200px;
            float: left;
        }
        .container .item img{
            width: 250px;
            height: 200px;
            padding: 10px;
        }
        .falls{
            float: left;
            margin-left: 20px;
            width: 250px;

        }
        .falls img{
            width: 250px;
            height: 200px;
            border-radius: 5px;
            margin-top: 5px;
        }
    </style>
</head>
<body class="container">
    <div style="width: 900px;margin: 0 auto">
        <div class="falls">
            {% for row in user_list %}

                {% if forloop.counter|test:"3,1" %}
                    <div>
                        <img src="{{ row.src }}">
                        <p>{{ row.name }} => {{ forloop.counter }}</p>
                        <p>{{ row.summary }}</p>
                    </div>
                {% endif %}
            {% endfor %}

        </div>
        <div class="falls">
            {% for row in user_list %}

                {% if forloop.counter|test:"3,2" %}
                    <div>
                        <img src="{{ row.src }}">
                        <p>{{ row.name }} => {{ forloop.counter }}</p>
                        <p>{{ row.summary }}</p>
                    </div>
                {% endif %}
            {% endfor %}

        </div>
        <div class="falls">
            {% for row in user_list %}

                {% if forloop.counter|test:"3,0" %}
                    <div>
                        <img src="{{ row.src }}">
                        <p>{{ row.name }} => {{ forloop.counter }}</p>
                        <p>{{ row.summary }}</p>
                    </div>
                {% endif %}
            {% endfor %}
        </div>
    </div>


</body>
</html>

 

VIEWS

  

def falls(request):
    user_list = [
        {name: 张三, src: /static/7777.jpeg, company: aaaaaaa,
         summary: 夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深夜深},
        {name: 李四, src: /static/1111.jpeg, company: sssss, summary: 晚上晚上晚上晚上晚上晚上晚上晚上晚上晚上晚上晚上晚上晚上晚上},
        {name: 王五, src: /static/2222.jpeg, company: ddddddd, summary: 耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵耳朵},
        {name: 赵六, src: /static/3333.jpeg, company: ffffff, summary: 前端前端前端前端前端前端前端前端前端前端前端前端前端前端前端前端},
        {name: 田七, src: /static/4444.jpeg, company: ggggg, summary: 晚饭晚饭晚饭晚饭晚饭晚饭晚饭晚饭晚饭晚饭晚饭晚饭晚饭晚饭晚饭晚饭晚饭},
        {name: 刘八, src: /static/5555.jpeg, company: hhhhh, summary: 通过通过通过通过通过通过通过通过通过通过通过通过通过通过通过通过},
        {name: 九九, src: /static/6666.jpeg, company: wwwww, summary: 用户用户用户用户用户用户用户用户用户用户用户用户用户用户用户},
    ]
    return render(request, falls.html, {user_list: user_list})

tags

from django.utils.safestring import mark_safe
from django import template

register = template.Library()
#取余
@register.filter
def test(a1,a2):
    n1,n2 = a2.split(,)
    if a1 % int(n1) == int(n2):
        return True
    return False

效果图:

技术分享

 

【python】瀑布流

标签:false   .com   前端   ack   code   util   container   ring   type   

原文地址:http://www.cnblogs.com/bk770466199/p/6377601.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!