在CSS中，要使列表項（li）在顯示時換行，可以使用多種方法，以下是一些常見的解決方案：
1、使用CSS的list-style-type屬性：
- 將list-style-type設(shè)置為circle或square，這會使每個列表項前有一個標記，并自動換行。
```css
ul {
list-style-type: circle;
}
```
2、使用display: block：
- 將列表項設(shè)置為塊級元素，這樣每個列表項都會在新的一行上開始。
```css
li {
display: block;
}
```
3、使用margin和padding：
- 通過設(shè)置外邊距（margin）和內(nèi)邊距（padding），可以確保列表項之間有足夠的空間來換行。
```css
li {
margin: 10px 0;
padding: 10px;
}
```
4、使用Flexbox或Grid布局：
- 使用CSS的Flexbox或Grid布局，可以更加靈活地控制列表項的顯示和位置。
```css
ul {
display: flex;
flex-wrap: wrap;
}
```
5、使用JavaScript：
- 在某些情況下，可能需要使用JavaScript來動態(tài)地檢測和調(diào)整列表項的顯示，根據(jù)窗口大小或內(nèi)容長度來自動換行。
```javascript
function autoWrapList(ul, maxItems) {
var items = ul.children;
var count = items.length;
var i = 0;
var frag = document.createDocumentFragment();
var line = 0;
var lines = document.createElement('div');
lines.style.display = 'flex';
lines.style.flexWrap = 'wrap';
while (i < count) {
if (i % maxItems === 0 && i > 0) {
frag.appendChild(lines);
lines = document.createElement('div');
lines.style.display = 'flex';
lines.style.flexWrap = 'wrap';
}
lines.appendChild(items[i]);
i++;
}
ul.appendChild(frag);
}
```
這些方法可以根據(jù)具體的需求和場景來選擇和使用，希望這些建議能幫助你解決CSS中列表項換行顯示的問題。
