将列表项显示为列

Question

我需要按特定顺序在列中显示列表项。

例如，我有这样的代码：

<div style="height:400px;">
<ul>
   <li>1</li>
   <li>2</li>
   <li>3</li>
   <li>4</li>
   <li>5</li>
   <li>6</li>
   <li>7</li>
</ul>
</div>

我想在三个列中显示它，如下所示：

1   5
2   6
3   
4

或者会有更多元素：

1  5  9
2  6  10
3  7  11
4  8

列数+列宽不会起作用，因为它试图显示水平填充的列表，我需要以垂直顺序显示它（如果没有第二列或第三列，它就会打开）。

有解决方案吗？

Answer 1

我有一个使用Flexbox的解决方案。它要求您的ul具有指定的高度。

cmd /u /c"type normal.txt" | find /v "" > vertical.txt 

“flex-direction：column”使项目垂直堆叠。 “flex-wrap：wrap”使得当填充一个时，它们将换行到下一列。并且列表项上的“flex-basis：25％”使得每个项目都是父项高度的四分之一。因此，如果您希望每列有更多或更少的行，则可以更改此数字。

Answer 2

我不知道你将在哪里使用它，所以也许我的答案是错误的。 购买你可以使用表格标签

async defs