html - 移动设备与桌面设备的图像、标题和描述的 Bootstrap 顺序

Question

我的移动页面有一个 Bootstrap 布局，如下所示:

[标题]
[图像]
[说明]

在桌面上我希望它显示为:

[图片][标题]
[图片][描述]

因此，来自移动设备的单个图像占据了屏幕的左侧，而标题和描述则在右侧堆叠在一起。如果这里的顺序没有改变，我就可以做到，但我想不出如何在每个标题和描述之上叠加。我当前的布局将描述推到一个新行上。如何创建此配置？

Answer 1

简单的解决方案:-

 <div class="row">
      <div class="col-sm-6">
        <img class="img-responsive" src="http://alto-live.s3.amazonaws.com/C39a2mvdXkhEsdxtqRWs55o4xGM/xw37B9xnyd1qi8ARMKz2jR_-A18/Photo/[2]/CRgx69es5Eeqfb2A35bWbg.jpg" alt="your image">
      </div>
      <div class="col-sm-6">
        <h3 class="text-center">Image Title</h3>
        <p class="text-center">Image desciption</p>
      </div>
    </div>