我需要在Bootstrap 3中使用2.5列和9.5列。有人能给我一个解决方案吗?我唯一找到的答案是将3列分为一组。我需要2个半列。
我需要在Bootstrap 3中使用2.5列和9.5列。有人能给我一个解决方案吗?我唯一找到的答案是将3列分为一组。我需要2个半列。
.col-md-half {
@extend .col-md-1;
width: percentage((0.5 / $grid-columns));
}
这个解决方案与Ardee Aram的解决方案类似,但是利用了Bootstrap的$grid-columns变量。
我使用这段代码来生成半列:
.col-md-half {
@extend .col-md-1;
width: 4.166666667%;
}
如果你有疑问,一列是100%/ 12 = 8.3333%。因此,半列是这个值的一半。
想知道创建嵌套列是否可行?
<div class="row">
<div class="col-sm-2" style="background:red">
Column spans two
</div>
</div>
<div class="row">
<div class="col-sm-6">
<div class="col-sm-6" style="background:pink">
column spans 2.5
</div>
</div>
</div>
代码演示:https://jsfiddle.net/timgavin/5d5rvba1/
无论如何,这是一个可以玩耍的东西... :)