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

Question

我认为在 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>

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

Answer 1

自 Bootstrap V4 以来，hidden-X 类已被删除。为了根据列宽隐藏列，请使用 d-none d-X-block。基本上，您只需关闭要隐藏的尺寸的显示，然后设置更大尺寸的显示即可。

• 对所有人隐藏 .d-none
• 在 xs 上隐藏 .d-none .d-sm-block
• 隐藏在 sm .d-sm-none .d-md-block
• 在 md 上隐藏 .d-md-none .d-lg-block
• 隐藏在 lg 上 .d-lg-none .d-xl-block
• 在 xl 上隐藏 .d-xl-none

取自this answer .