Bootstrap 基本操作

Posted on | In

基础的Bootstrap概念

container container-fluid

1
2
3
<div class="container-fluid">
.....
</div>

定义div下为container
区别：固定宽度或满屏幕宽度

grid 布局：row

1
2
3
4
<div class="row">
   <div class="col-**-*"></div>
   <div class="col-**-*"></div>
</div>

row分为12 columns，五个等级

xs sm md lg xl
<576 >576 >768 >992 >1200

对应不同的viewport来进行不同的布局，例如：

1
2
3
<div class="col-xs-12 col-sm-9 col-md-6 col-lg-3">
                        
</div>