如何在手机上让4个响应栏变成2个？
如何在手机上让4个响应栏变成2个？
提问于 2014-11-06 11:00:14
我正在尝试使用bootstrap grid拥有4个响应列，如下所示：
[] [] [] []但在手机上，我希望它看起来如下所示：
[] []
[] []但当我使用这个专栏时，我最终在手机上得到了以下内容：
[]
[]
[]
[]如何修复它，使其成为2x2？我最初使用的是类"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>
回答 1
Stack Overflow用户
发布于 2014-11-06 16:33:10
尝尝这个
<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> 页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26771005
复制相关文章
相似问题
腾讯云开发者
