在bootstrap 3中，我认为我们可以这样做，删除左右边距:

<div class="row this_row">
    <div class="col-md-2 col-md-offset-1"></div>
    <div class="col-md-2"></div>
    <div class="col-md-2"></div>
    <div class="col-md-2"></div>
    <div class="col-md-2"></div>
</div>

和CSS

.this_row {
    margin: 0 -5%;
}

最简单的方法是在行中添加row-cols-5。点击这里阅读更多

<div class="container">
  <div class="row row-cols-5">
    <div class="col">Col 1</div>
    <div class="col">Col 2</div>
    <div class="col">Col 3</div>
    <div class="col">Col 4</div>
    <div class="col">Col 5</div>
  </div>
</div>

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"> <div class="container"> <div class="row row-cols-5"> <div class="col border bg-primary">Col 1</div> <div class="col border bg-primary">Col 2</div> <div class="col border bg-primary">Col 3</div> <div class="col border bg-primary">Col 4</div> <div class="col border bg-primary">Col 5</div> <div class="col border bg-primary">Col 6</div> <div class="col border bg-primary">Col 7</div> </div> </div>

默认情况下，Bootstrap不提供允许我们创建五列布局的网格系统，您需要按照Bootstrap的方式创建默认列定义 在CSS文件中创建一些自定义类和媒体查询

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}
.col-xs-15 {
    width: 20%;
    float: left;
}
@media (min-width: 768px) {
.col-sm-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}

还有一些HTML代码

<div class="row">
    <div class="col-md-15 col-sm-3">
    ...
    </div>
</div>

对于twitter bootstrap 3，这是最简单的方法来实现这一点:

<section class="col col-sm-3" style="width: 20%;">
<section class="col col-sm-3" style="width: 20%;">
<section class="col col-sm-3" style="width: 20%;">
<section class="col col-sm-3" style="width: 20%;">
<section class="col col-sm-3" style="width: 20%;">

Bootstrap默认可以缩放到12列?这意味着如果我们想要创建一个宽度相同的12列布局，我们将在div class="col-md-1"中写入12次。

<div class="row">
<div class="col-md-1"></div>    
<div class="col-md-2">1</div>
<div class="col-md-2">2</div>
<div class="col-md-2">3</div>
<div class="col-md-2">4</div>
<div class="col-md-2">5</div>
<div class="col-md-1"></div>
</div>

它可以通过嵌套和使用一点css覆盖来完成。

<div class="col-sm-12">
<div class="row">
  <div class="col-sm-7 five-three">
    <div class="row">
      <div class="col-sm-4">
      Column 1
      </div>
      <div class="col-sm-4">
      Column 2
      </div>
      <div class="col-sm-4">
      Column 3
      </div><!-- end inner row -->
    </div>
  </div>
  <div class="col-sm-5 five-two">
    <div class="row">
      <div class="col-sm-6">
        Col 4
      </div>
      <div class="col-sm-6">
      Col 5
      </div>
    </div><!-- end inner row -->
  </div>
</div>​<!-- end outer row -->

然后是css

@media  (min-width: 768px) {
div.col-sm-7.five-three {
width: 60% !important;
}

div.col-sm-5.five-two {
width: 40% !important;
}

}

下面是一个例子:5等列的例子

这是我写的关于代码墙的全部内容

在bootstrap 3中有5个相等的列