Django引导卡组如果forloop可除

Django引导卡组如果forloop可除,django,for-loop,bootstrap-4,counter,Django,For Loop,Bootstrap 4,Counter,我正在尝试使用引导卡。但我有问题。 当我添加新的帖子作为一张卡片显示时,我显示了超过5张,它们开始扭曲。 我尝试使用forloop计数器在每次显示超过5张卡时启动新行。 但是我做错了什么。我什么都读,到处都是一样的。但我肯定我做错了 <div class="card-deck"> {% for post in post_list %} {% if forloop.counter0|divisibleby:3 %} <div class="c

我正在尝试使用引导卡。但我有问题。 当我添加新的帖子作为一张卡片显示时,我显示了超过5张,它们开始扭曲。 我尝试使用forloop计数器在每次显示超过5张卡时启动新行。 但是我做错了什么。我什么都读,到处都是一样的。但我肯定我做错了

     <div class="card-deck">
    {% for post in post_list %}
    {% if forloop.counter0|divisibleby:3 %}
      <div class="card border-primary mb-3" style="max-width: 20rem;">
          <a href="{% url 'post_detail' post.slug  %}">
              <img style="height: 200px; width: 100%; display: block;" src="{{ post.thumb.url }}" alt="Card image"></a>
                  <div class="card-header">Header</div>
                      <div class="card-body">
                      <h4 class="card-title">{{ post.title }}</h4>
                      <p class="card-text">{{post.content|slice:":200" }}</p>
                      </div>
      </div>   {% endif %}    
  </div>      
 </div>  {% endfor %}          

{post_list%}中的post为%
{%if-forloop.counter0 | divisibleby:3%}
标题
{{post.title}}

{{post.content|slice::200}

{%endif%} {%endfor%}

现在你只看到第三张牌(因为“可分割的B:3”)。我不确定您想要实现什么,但是如果您想要显示所有卡片,有几个选项。其中两个是卡片组()和卡片组(),但当卡片数量越来越多时,它们确实会变得混乱。我成功使用的一个解决方案是使用Bootstrap的网格。当视口较小或卡片数量较大时,卡片将自动换行到下一行。下面的代码应该可以工作(尚未测试):

div class=“容器流体”>
{post_list%}中的post为%
标题
{{post.title}}

{{post.content|slice::200}

{%endfor%}
我想你只渲染第三篇文章?你会怎么做新行?是的,我希望渲染每3-4篇文章。现在它只渲染了两个帖子。就这样。我想我没有正确理解你。对不起。我希望所有的职位。分成几行。3-4个柱(卡)排成一行。然后在下面张贴(卡片)。如果那对你有意义的话,谢谢你,伙计。有人告诉我这是一个解决办法。使用此参数执行此操作。我是个新手。只是学习。现在可以了。谢谢很抱歉,我不能加上你的答案,因为我没有足够的分数。
div class="container-fluid">
    <div class="row">
        {% for post in post_list %}
            <div class="col-auto">
                <div class="card border-primary mb-3">
                    <a href="{% url 'post_detail' post.slug  %}">
                        <img style="height: 200px; width: 100%; display: block;" src="{{ post.thumb.url }}" alt="Card image">
                    </a>
                    <div class="card-header">
                        Header
                    </div>
                    <div class="card-body">
                        <h4 class="card-title">{{ post.title }}</h4>
                        <p class="card-text">{{ post.content|slice:":200" }}</p>
                    </div>
                </div>
            </div>
        {% endfor %}
    </div>
</div>