如何在移动设备中保持每行 3 列的网格 - Bootstrap 4
How to keep the grid with 3 columns per row in mobile - Bootstrap 4
我想在移动设备、桌面设备等设备中将行分成 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>
<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>
在 bootstrap 4 中,col-xs-4 被替换为 col-4
我想在移动设备、桌面设备等设备中将行分成 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>
<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>
在 bootstrap 4 中,col-xs-4 被替换为 col-4