如何在移动设备中保持每行 3 列的网格 - Bootstrap 4答案

【问题标题】：How to keep the grid with 3 columns per row in mobile - Bootstrap 4如何在移动设备中保持每行 3 列的网格 - Bootstrap 4
【发布时间】：2020-02-27 13:03:13
【问题描述】：

我想在移动设备、台式机等设备中将行分成 3 列。但目前，在移动设备中，每行仅显示 1 列。

                <div class="container">
                    <div class="row">
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                            demotext1
                        </div>
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                            demotext1
                        </div>
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                            demotext1
                        </div>
                    </div>
             </div>

【问题讨论】：

标签： twitter-bootstrap bootstrap-4 bootstrap-grid

【解决方案1】：

<div class="container">
   <div class="row">
       <div class="col-lg-4 col-md-4 col-sm-4 col-4">
             demotext1
       </div>
       <div class="col-lg-4 col-md-4 col-sm-4 col-4">
             demotext1
       </div>
       <div class="col-lg-4 col-md-4 col-sm-4 col-4">
             demotext1
       </div>
   </div>
</div>

在 bootstraph 4 中 col-xs-4 被 col-4 替换

【讨论】：