如何在Django Bootstrap中每行显示2个span6缩略图?

发布于 2021-01-29 16:16:39

我想每行显示2个缩略图。仅使用多行对其进行硬编码,而每一行都有2
span6div,这将是微不足道的。但是我该如何在Django中使用模板for循环来做到这一点?

例:

{% for image in images %}
  <div class="row">
    <div class="span6">*image goes here*</div>
    <div class="span6">*image goes here*</div>
  </div>
{% endfor %}

// repeat for all items in the list, with 2 images per row

因此,在上面的代码中,span6应该在每个循环迭代中创建一次,但row应该仅每2个迭代创建一次。

更新
:我能够将我所有的span6元素都放在一行中。我遇到了缩略图无法正确对齐(行之间的空白)的问题。将所有缩略图设置为统一的高度可以解决此问题。但是Hedde的解决方案看起来也不错,尽管这涉及在Python方面进行更改。

关注者
0
被浏览
45
1 个回答
  • 面试哥
    面试哥 2021-01-29
    为面试而生,有面试问题,就找面试哥。

    好吧,它只能由css完成,但是,如果要使用提供的网格,则可以创建一个生成器,并在视图的查询集上使用它,或者通过使用标签直接在模板中使用它,例如

    def grouped(l, n):
        # Yield successive n-sized chunks from l.
        for i in xrange(0, len(l), n):
            yield l[i:i+n]
    

    模板标签

    @register.filter
    def group_by(value, arg):
        return grouped(value, arg)
    

    范本

    {% for group in objects|group_by:2 %}
        <div class="row">
            {% for obj in group %}
                <div class="span6">
                    foo
                </div>
            {% endfor %}
        </div>
    {% endfor %}
    


知识点
面圈网VIP题库

面圈网VIP题库全新上线,海量真题题库资源。 90大类考试,超10万份考试真题开放下载啦

去下载看看