我已经对bootstrap网格系统进行了编码，但当我使屏幕变小时，一切都会出错？

Question

我是bootstrap的新手。现在，当我编写以下代码时，我已经下载并在我的function.php中排队：

<section class="container" id="repair">

<div class="row">

<article class="col-sm-6 col-md-4 col-lg-2 col-xl-2">
<h5>Reparatie</h5>
</article>

<article class="col-sm-6 col-md-4 col-lg-2 col-xl-2">
<h5>Grote beurt</h5>
</article>

<article class="col-sm-6 col-md-4 col-lg-2 col-xl-2">
<h5>Kleine beurt</h5>
</article>

<article class="col-sm-6 col-md-4 col-lg-2 col-xl-2">
<h5>Olie verversen</h5>
</article>

<article class="col-sm-6 col-md-4 col-lg-2 col-xl-2">
<h5>Wintercheck</h5>
</article>

<article class="col-sm-6 col-md-4 col-lg-2 col-xl-2">
<h5>Zomercheck</h5>
</article>

</div>


</section> 

当我转到我的网站url:http://webdesignleren.net/reparatie-ondehoud/

我在大屏幕上看到了6列，但当我开始缩小屏幕时，我看不到md-4的3列。屏幕变小后，一切都出错了。这是怎么来的，我做错了什么，我必须写媒体查询吗？但我认为首先它必须是md-4格式，当我使屏幕更小，因为我也使用基础网格系统。谢谢约翰尼斯

Answer 1

您使用了不需要的cols。试试这段代码。

<section class="container" id="repair">

<div class="row">

<article class="col-md-6">
<h5>Reparatie</h5>
</article>

<article class="col-md-6">
<h5>Grote beurt</h5>
</article>

<article class="col-md-6">
<h5>Kleine beurt</h5>
</article>

<article class="col-md-6">
<h5>Olie verversen</h5>
</article>

<article class="col-md-6">
<h5>Wintercheck</h5>
</article>

<article class="col-md-6">
<h5>Zomercheck</h5>
</article>

</div>


</section>