这可以通过auto-fit和minmax()来实现。
在下面的示例中，当容器的宽度小于400px + grid-gap时，列移动到下一行：

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-gap: 10px;
}

.grid-cell {
  border: solid 1px;
}

<div class="grid">
    <div class="grid-cell">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dignissimos, sed, sunt consectetur reiciendis vitae illo id expedita provident dolore tenetur eos dolor cupiditate perspiciatis hic necessitatibus rem vel molestiae laboriosam nulla alias eum sapiente eaque quas asperiores ratione architecto corporis.</div>
    <div class="grid-cell">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptas, autem!</div>
</div>