如何在移动设备上将4个响应列设置为2？

Question

我试图用引导电网有4分响应列如下所示：

[] [] [] [] 

但随后在移动，我想它看起来如下：

[] [] 
[] [] 

，但是当我使用的列我最终在手机上获得以下内容：

[] 
[] 
[] 
[] 

如何修复它使其成为2 x 2？我最初使用的是“col-md-4”类，但是这样做并不成功，所以我尝试在课堂上做两列

请参阅下面的内容：移动设备上使用1 x 4格式，但在平板电脑上使用2 x 2

<div class="row"> 
<div class="col-sm-6 col-lg-3"> 
    This is option 1. 
</div> 
<div class="col-sm-6 col-lg-3"> 
    This is option 2. 
</div> 
<div class="col-sm-6 col-lg-3"> 
    This is option 3. 
</div>  
<div class="col-sm-6 col-lg-3"> 
    This is option 4. 
</div>  

Answer 1

试试这个

<div class="row"> 

<div class="col-xs-6 col-sm-3"> 
    This is option 1. 
</div> 
<div class="col-xs-6 col-sm-3"> 
    This is option 2. 
</div> 
<div class="col-xs-6 col-sm-3"> 
    This is option 3. 
</div>  
<div class="col-xs-6 col-sm-3"> 
    This is option 4. 
</div> 

</div>