使用媒体查询操作 div答案

【问题标题】：manipulating divs with media queries使用媒体查询操作 div
【发布时间】：2017-12-29 17:53:59
【问题描述】：

我的 HTML 看起来像这样：

<div class="col-lg-6">BLAH BLAH BLAH BLAH</div>
<div class="col-lg-6"><img src=""></img></div>

<div class="col-lg-6"><img src=""></img></div>
<div class="col-lg-6">BLAH BLAH BLAH BLAH</div>

<div class="col-lg-6">BLAH BLAH BLAH BLAH</div>
<div class="col-lg-6"><img src=""></img></div>

但是，当我的屏幕调整为移动设备时，我需要第二个元素图片仍显示在文本下方而不是顶部。

任何内置的 Twitter Bootstrap 类都可以做到这一点吗？还是一些媒体查询操作？

【问题讨论】：

标签： html twitter-bootstrap css twitter-bootstrap-3 media-queries

【解决方案1】：

您可以使用这些类。根据设备隐藏和显示元素

https://v4-alpha.getbootstrap.com/layout/responsive-utilities/

您也可以使用col-xs- 类

例如： <div class="col-lg-6 col-xs-12"><img src=""></img></div>

【讨论】：

使用 col-xs- 在调整到移动宽度时不会将上方的元素移动到下方