Bootstrap - 对于各种屏幕分辨率，对齐不同的div

Question

我是使用Bootstrap的新手，我想创建图像中显示的内容。这是我的出发点。

 <div class='row'>
      <div class='col-sm-12 col-md-8'>text</div>
      <div class='col-sm-12 col-md-4'>
           <div>text</div>
           <div>
                <div><img src=''/></div>
                <div><img src=''/></div>
           </div>
      </div>
 </div>

Answer 1

重要的是要明白，如果你使用Bootstrap列类，比如.col-md-8，那么在屏幕尺寸小于“md”时，这将自动更改为100％的列宽。因此，无需添加.col-sm-12，因为它是自动的。

请参阅我创建的小提琴，以实现您的目标：https://jsfiddle.net/vandigroup/7qLq0tz8/4/

请记住，如上所述，在小于“sm”断点的设备上，列宽将更改为100％。您可以向要控制的列添加额外的.col-xs-*。