Bootstrap 4 网格系统有以下 5 个类:
- .col- 针对所有设备
- .col-sm- 平板 - 屏幕宽度等于或大于 576px
- .col-md- 桌面显示器 - 屏幕宽度等于或大于 768px)
- .col-lg- 大桌面显示器 - 屏幕宽度等于或大于 992px)
- .col-xl- 超大桌面显示器 - 屏幕宽度等于或大于 1200px)
可以自动等宽分列,比如等分5列(bootstrap3难做到):
<div class="container-fluid"> <div class="content"> <div class="row"> <div class="col" style="background-color:red;">aaaa</div> <div class="col" style="background-color:pink;">bbbb</div> <div class="col" style="background-color:pink;">cccc</div> <div class="col" style="background-color:pink;">dddd</div> <div class="col" style="background-color:pink;">eeee</div> </div> </div> </div>