<div id="container">
  <div class="item item-1">1</div>
  <div class="item item-2">2</div>
  <div class="item item-3">3</div>
  <div class="item item-4">4</div>
  <div class="item item-5">5</div>
  <div class="item item-6">6</div>
  <div class="item item-7">7</div>
  <div class="item item-8">8</div>
  <div class="item item-9">9</div>
</div>

方式一 grid布局

#container{
  display: grid;
  grid-template-columns: 100px 100px 100px;
  grid-template-rows: 100px 100px 100px;
}
.item {
    border: 1px solid red;
}

方式二 flex布局

#container{
  display: grid;

}
.item {
    width: 32%;
    margin-right: 1%;
    border: 1px solid red;
}
  .item:nth-of-type(3n) {
    margin-right: 0;
  }