是否可以在bootstrap中使用13列网格

时间:2016-07-13 11:19:12

标签: twitter-bootstrap

我正在尝试使用bootstrap和css3获取超过12列,但它没有显示出良好的结果

所以是否可以在bootstrap中使用12列以上

2 个答案:

答案 0 :(得分:4)

您可以在更少的时间内完成此操作,但您可能希望使用16或24列。这是一个例子:  设置变量

    @gridColumns: 13
    @gridColumnWidth: 30px
    @gridGutterWidth: 10px

如果使用流体网格,您也希望按比例更改这些变量,否则span12仍将占据宽度的100%,而span24将占用200%

@fluidGridColumnWidth
@fluidGridGutterWidth
  

如何自定义   修改网格意味着更改三个@ grid *变量并重新编译Bootstrap。更改variables.less中的网格变量,并使用记录的四种方法之一进行重新编译。如果您要添加更多列,请务必为grid.less中的那些添加CSS。

您可以在此处更改变量并下载新的css:http://twitter.github.com/bootstrap/download.html#variables

这是一个应该适用于16列的已编译示例(尚未经过测试,让我知道它是如何工作的):https://s3.amazonaws.com/intenex/bootstrap16columns.zip

答案 1 :(得分:0)

不,据我所知,Bootstrap仅设计为12列网格。我不确定您遇到什么样的UI问题,但是,也要看看Bootstraps网格的响应方面。

还有其他框架有16列,例如Semantic-ui

希望这有帮助。