CSS是前端開發(fā)中的一個重要技術，其中一個常見的應用是控制列表的樣式。在有些情況下，我們可能需要讓列表在一行放不下時自動換行，那么該怎么做呢？

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

上面的CSS代碼中，我們使用了彈性布局（flex）和它的換行屬性（flex-wrap），從而實現(xiàn)了讓列表自動換行的效果。下面來詳細解釋一下這段代碼的作用：

• 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讓我們可以靈活地控制列表的樣式，包括讓列表自動換行。我們只需要設置好彈性布局和伸縮容器的屬性，或者直接對列表項進行樣式設置，就能輕松實現(xiàn)列表自動換行的效果。