如何在引导程序上使用半列？

Question

我正在尝试使用这样的引导程序获取一行的列：

col 1.5 | col 9 | col 1.5

但我不知道如何获得它。我查看了这篇文章：Half columns in Twitter Bootstrap 3，但它也对我没有帮助，因为我需要整个列都位于 1.5 列的中心。

有没有办法在引导程序上做到这一点？

提前致谢！

Answer 1

如果您不愿意使用此处发布的答案，则必须创建自己的样式：Half columns in Twitter Bootstrap 3

如果您查看 Bootstrap，您会发现它的工作原理并不神秘。例如：

.col-sm-5 {
    width: 41.66666667%;
}

由于引导程序（通常）是 12 列网格，您可以看到数学很简单：5 / 12 = 41.6666667%。

因此，您只需编写自己的 OWN 样式，然后计算：1.5 / 12 = 12.5%；

Bootstrap 3 种尺寸：

// Note, you can't use a dot in the middle, so separate with underscore or dash
.col-xs-1_5 {
    width: 12.5%;
}

@media(min-width:768px){
    .col-sm-1_5 {
        width: 12.5%;
    }
}

@media(min-width:992px){
    .col-md-1_5 {
        width: 12.5%;
    }
}

@media(min-width:1200px){
    .col-lg-1_5 {
        width: 12.5%;
    }
}

不要修改引导 css 文件。将以上样式放入自己的css文件中。