Bootstrap 3 如何在小型设备（平板电脑、智能手机）中删除或移动以下偏移量？答案

【问题标题】：Bootstrap 3 how to remove or move offset below in small devices(tablet, smartphone)?Bootstrap 3 如何在小型设备（平板电脑、智能手机）中删除或移动以下偏移量？
【发布时间】：2018-01-08 14:24:01
【问题描述】：

这是我的网络应用程序视图中的主要 div（在 Rails 5 中）：

<nav class="navbar navbar-inverse navbar-fixed-top" >
   my navbar
</nav>
<div class="col-md-6 col-md-offset-3">
  the main content of my web app
</div>

这在 PC 浏览器中看起来不错，但我希望 col-md-offset-3 在小型设备中消失，因为它会在两侧产生空白并且内容变小，因此这个 div 类 col-md-6可以占据小设备的整个宽度。或者对于不同但更好的解决方案：是否可以创建

<div class="col-md-3/> <div class="col-md-6"> <div class="col-md-3/>

当我在小型设备中执行时，div col-md-3 在底部（下方）移动 div class="col-md-6。我该怎么做？

【问题讨论】：

您是否尝试过在小型设备上使用此类 col-xs-* 和 col-sm-*？
或者，您可以使用 col-xs-offset-0 和 col-sm-offset-0

标签： html css twitter-bootstrap-3 responsive-design

【解决方案1】：

所以对于带有列类的 dix，你可以做这样的事情

<div class="col-md-6 col-md-offset-3 col-xs-12 col-xs-offset-0">
  the main content of my web app
</div>

这会使您的 div 填充整个 12 列。并删除超小型设备上的偏移量。对于小型设备，您也可以对“col-sm-*”类执行相同的操作。

【讨论】：