bootstrap栅格系统自定义列

bootstrap栅格系统默认是12列，有时候需自定义列数，比如显示5列

简单做法：原理就是找到控制列的样式覆盖它，这里以中等屏幕示例：

1
2
3
4
5
6
7
8
9
10
11
1<span style="font-size:12px;">/*一行5列*/

2.col-md-5ths{position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;}

3.col-md-5ths{float: left;}

4.col-md-5ths{width: 20%;}

5.col-md-pull-2dot4{right: 20%;}

6.col-md-push-2dot4{left: 20%;}

7.col-md-offset-2dot4{margin-left: 20%;}

8.pimgl img{float:right;}

9.pimg img{float:left;}

10.carousel-inner > .item > img{width:100%;}</span>

11

附：bootstrap不同屏幕对应的样式
bootstrap3.x使用了四种栅格选项来形成栅格系统，这四种选项在官网上的介绍如下图，很多人不理解，这里跟大家详解一下四种栅格选项之间的区别，
其实区别只有一条就是适合不同尺寸的屏幕设备。我们看class前缀这一项，我们姑且以前缀命名这四种栅格选项，他们分别是col-xs、col-sm、col-md、col-lg，我们懂英文的就知道，lg是large的缩写，md是mid的缩写，sm是small的缩写，xs是***的缩写。这样命名就体现了这几种class适应的屏幕宽度不同。下面我们分别介绍这几种class的特点。

通过下表可以详细查看Bootstrap的栅格系统如何在多种屏幕设备上工作的。