<li> 将列表垂直更改为 4 行间隔

Question

我有一个类似的ul-li列表

• 项目行1
• 物料行2
• 物料行3
• 物料行4
• 物料行5
• 物料行6
• 物料行7
• 物料行8
• 物料行9
• 物料行10
• 物料行11
• 物料行12

我需要更改为这个，只有CSS才有可能？

物料行1物料行5物料行9物料行2物料行6物料行10物料行3物料行7物料行11物料行4物料行8物料行12

关注

Daniel

Answer 1

在<ul>上使用columns。

ul {
columns: 3;
}

<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
<li>Item 6</li>
<li>Item 7</li>
<li>Item 8</li>
<li>Item 9</li>
<li>Item 10</li>
<li>Item 11</li>
<li>Item 12</li>
</ul>