Bootstrap - Выравнивать divs по-разному для различных разрешений экрана

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, это будет автоматически переключаться в ширину столбца 100% на экране меньшего размера, чем «MD» , Таким образом, нет необходимости добавлять .col-sm-12, потому что его автоматический.

Пожалуйста, смотрите скрипку, который я создал для acocmplish своей цели: https://jsfiddle.net/vandigroup/7qLq0tz8/4/

Имейте в виду, что, как уже упоминалось выше, на устройствах меньшего размера, чем «см» точки останова, ширина колонки изменится на 100%. Вы можете добавить дополнительный столбец .col-xs-* в колонку, которую вы хотите контролировать в качестве альтернативы.