css – 如何在bootstrap移动版本中隐藏网格中的一列

我认为我想在引导程序移动版本中隐藏网格中的一列是有点棘手的.让我们举个例子

<div class="row">
  <div class="col-xs-9">
    <p class="testimonial-about">"We have managed to received good number of applications through MyJobs in comparison to advertising in the newspaper and would recommend MyJobs to other companies to assist with their recruitment needs"</p>
  </div>
  <div class="col-xs-3 center-image hidden-xs"><img src="myimage.png"/></div>
</div>

以上编码,我在移动设备查看时隐藏图像部分.我想要的是我不想要图像部分的间距,即使它被隐藏为增加左侧部分直到右侧.

解决方法

因为,您将第二列隐藏在“xs”中,您可以通过将类“col-xs-12”定义为column1来使用第一列的全宽.

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row">
  <div class="col-xs-12 col-sm-9">
    <p class="testimonial-about">"We have managed to received good number of applications through MyJobs in comparison to advertising in the newspaper and would recommend MyJobs to other companies to assist with their recruitment needs"</p>
  </div>
  <div class="col-sm-3 center-image hidden-xs"><img src="myimage.png"/></div>
</div>