Bootstrap 提供了一套响应式、移动设备优先的流式网格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列。
网格系统类似一个表格,有行和列,它必须放置在一个类型设置为container的容器里,可以是div,内容放置在列内,网页设计中的网格用于布局内容,让网站易于浏览,下面是一个用bootstrap网格布局的例子。
rush:js;">
col2
col10
加了Class=”row”的样式表示行,加了class=”col-sm-2”的样式表示列,系统将整个屏幕分为12份,col-sm-2表示该列跨2份,col-sm-10比表示该列跨10份。显示的效果就会如上图所示,表示一行两列,第一列占2份,第二列占10份。
bootstrap是一个响应式的前端框架,体现在网格系统中就是对应于不同的显示大小的设备,可以呈现出不同的显示效果。如下所示: