<div class="container">
  <div class="box">盒子1</div>
  <div class="box">盒子2</div>
  <div class="box">盒子3</div>
</div>

.container {
  display: flex;
  flex-wrap: wrap;
}

.box {
  flex-basis: 33.33%;
  height: 100px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  padding: 10px;
}

@media (max-width: 767px) {
  .box {
    flex-basis: 50%;
  }
}

@media (max-width: 479px) {
  .box {
    flex-basis: 100%;
  }
}