дизайн начальной страницы 4 изменяемых размера колонки

Question

Создание сайта, в основном ориентированного на мобильные устройства.Попытка расположить меню категорий (круговые фотографии) в центре браузера в настольном браузере, а затем изменить его размер и сложить в 2 строки по 3 при просмотре на мобильном устройстве.Может ли кто-нибудь помочь мне с правильными командами bootstrap4, чтобы сделать эту работу?

https://i.imgur.com/iAB4Pic.jpg

https://i.imgur.com/kZkvNTE.jpg

Answer 1

Используйте следующий код:

<div class="container">
  <div class="row">
    <div class="col-6 col-sm-2">One</div>
    <div class="col-6 col-sm-2">Two</div>
    <div class="col-6 col-sm-2">Three</div>
    <div class="col-6 col-sm-2">Four</div>
    <div class="col-6 col-sm-2">Five</div>
    <div class="col-6 col-sm-2">Six</div>
  </div>
</div>

Answer 2

 <div class="container">
   <div class="row">
    <div class="col-6 col-sm-2">One</div>
    <div class="col-6 col-sm-2">Two</div>
    <div class="col-6 col-sm-2">Three</div>
    <div class="col-6 col-sm-2">Four</div>
    <div class="col-6 col-sm-2">Five</div>
    <div class="col-6 col-sm-2">Six</div>
   </div>
 </div>

Спасибо Farhan Erooth за ответ!