这篇文章主要介绍了bootstrap3显示5列的方法,bootstrap是个12栅格的系统,显示5列比较麻烦,这里提供一个方法,需要的朋友可以参考下
bootstrap是个好东西,对于CSS不是很熟悉的同学可以用它快速的做个不丑的网站。
但是bootstrap是个12栅格的系统,显示5列比较麻烦,今天我也刚好有这个需求,就稍微研究了下,并且成功了。具体的做法是:
在 head 里加载 bootstrap 的 css <link href="http://cdn.staticfile.org/twitter-bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> 之后
自己再添加几个 css class
复制代码代码如下: <style> .col-lg-2dot4 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; } @media (min-width: 1200px) { .col-lg-2dot4 { float: left; } .col-lg-2dot4 { width: 20%; } .col-lg-pull-2dot4 { right: 20%; } .col-lg-push-2dot4 { left: 20%; } .col-lg-offset-2dot4 { margin-left: 20%; } } </style>
后需要显示 5 列的地方应用这个 class 即可 |