Bootstrap 仅在 md 上偏移不起作用

Question

您好，我正在尝试仅在中型设备上添加偏移量并在其他设备上隐藏此偏移量。我查看了其他一些类似的问题，但其中任何一个都可以解决我的问题。

代码如下：

<div class="container">
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-3" style="background-color: red"> 111 </div>
<div class="col-lg-4 col-md-4 col-sm-5 col-sm-offset-1" style="background-color: blue"> 222 </div>
<div class="col-lg-3 col-md-4 col-sm-1" style="background-color: black"> 333 </div>
<div class="col-lg-2 col-md-1 col-sm-2" style="background-color: orange"> 444 </div>
</div>
</div>

所以问题是它在每个设备上都添加了偏移量，而不仅仅是在介质上。

大屏幕：https://zapodaj.net/f4b34ebc771fb.png.html

Answer 1

我认为在较大的屏幕上偏移需要"reset"，否则它会继承以前的值。使用 col-sm-offset-1 col-md-offset-0 似乎可以解决问题。

<script src="https://code.jquery.com/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-3" style="background-color: red"> 111 </div>
<div class="col-lg-4 col-md-4 col-sm-5 col-sm-offset-1 col-md-offset-0" style="background-color: blue"> 222 </div>
<div class="col-lg-3 col-md-4 col-sm-1" style="background-color: black"> 333 </div>
<div class="col-lg-2 col-md-1 col-sm-2" style="background-color: orange"> 444 </div>
</div>
</div>

Answer 2

如果您希望在中型设备上使用偏移量，请使用 col-md-offset-1 而不是 col-sm-offset-1。

您还需要使用 col-lg-offset-0 重置大型设备的偏移量。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<div class="container">
  <div class="row">
    <div class="col-lg-3 col-md-3 col-sm-3" style="background-color: red">111</div>
    <div class="col-lg-4 col-md-4 col-sm-5 col-md-offset-1 col-lg-offset-0" style="background-color: blue">222</div>
    <div class="col-lg-3 col-md-4 col-sm-1" style="background-color: black">333</div>
    <div class="col-lg-2 col-md-1 col-sm-2" style="background-color: orange">444</div>
  </div>
</div>

Bootstrap 仅在 md 上偏移不起作用

Bootstrap offstet only on md doesn't work

css

offset

twitter-bootstrap