CSS是前端开发中的一个重要技术，其中一个常见的应用是控制列表的样式。在有些情况下，我们可能需要让列表在一行放不下时自动换行，那么该怎么做呢？

ul {
display: flex;
flex-wrap: wrap;
}

上面的CSS代码中，我们使用了弹性布局（flex）和它的换行属性（flex-wrap），从而实现了让列表自动换行的效果。下面来详细解释一下这段代码的作用：

• display: flex;将列表项设置为弹性子容器，使它们可以随着容器宽度的变化自动调整位置。
• flex-wrap: wrap;显示伸缩容器的子项目应该在同一行上，但是当不可能在容器内一行显示时，应该如何换行。这里我们将其设置为wrap，表示列表项在一行放不下时自动换行。

当然，我们也可以在具体的列表项中进行样式设置：

li {
display: inline-block;
width: 100px;
margin-right: 20px;
margin-bottom: 20px;
}

在这个示例中，我们使用了行内块级元素（inline-block）来让列表项在同一行上，并设置了固定的宽度（width）、右边缘距离（margin-right）和下边缘距离（margin-bottom），以达到高度自定义列表项样式的目的。

总的来说，CSS让我们可以灵活地控制列表的样式，包括让列表自动换行。我们只需要设置好弹性布局和伸缩容器的属性，或者直接对列表项进行样式设置，就能轻松实现列表自动换行的效果。