Bootstrap 4 Shopfiy-液体-引导

有人知道为什么即使我使用

col-md-6

类，也只能得到一列吗

div class="container">
{% for member in section.blocks %}
 <div class="row">
  <div class="col-lg-6 col-md-6">
    {% if member.settings.photo %}
    {{member.settings.photo | img_url: '300x' | img_tag }}   
    {%  endif %}
    <h3>{{ member.settings.name }}</h3>
    <span>{{ member.settings.title }}</span>
    <p>{{ member.settings.bio }}</p>
  </div>
   </div>
  {% endfor %}
</div>

div class=“container”>
{section.blocks%中的成员的%s}
{%if member.settings.photo%}
{{member.settings.photo | img_url:'300x'| img_tag}
{%endif%}
{{member.settings.name}
{{member.settings.title}
{{member.settings.bio}

{%endfor%}

---

因为您的每一行只包含一列。要解决此问题，必须在每行中输出2列。为此，可以使用如下条件运算符

<div class="container">
<div class="row"> <!-- opening row, outside loop -->
{% for member in section.blocks %}
 {% assign remainder = forloop.index0 | modulo:2 %}
 <!-- condition to close previous row div and open new one  -->
 {% if forloop.index0 !=0 AND remainder == 0 %}
     </div><div class="row">
 {% endif %}
  <div class="col-lg-6 col-md-6">
    {% if member.settings.photo %}
    {{member.settings.photo | img_url: '300x' | img_tag }}   
    {%  endif %}
    <h3>{{ member.settings.name }}</h3>
    <span>{{ member.settings.title }}</span>
    <p>{{ member.settings.bio }}</p>
  </div>
   </div>
  {% endfor %}
</div> <!-- closing row , opened outside loop-->
</div>

{section.blocks%中的成员的%s}
{%分配余数=forloop.index0 |模：2%}
{%if-forloop.index0！=0，余数==0%}
{%endif%}
{%if member.settings.photo%}
{{member.settings.photo | img_url:'300x'| img_tag}
{%endif%}
{{member.settings.name}
{{member.settings.title}
{{member.settings.bio}

{%endfor%}

此代码在每行中输出两列。查看代码注释以了解详细信息