9

我有一个有点长的列表，并希望它“包装”成垂直列。假设我有一个包含 10 个项目的列表，并且我希望它是每列 5 个项目，布局应该是这样的：

1   6
2   7
3   8
4   9
5   10

有没有办法在 CSS 中做到这一点？

4

2 回答 2

17

对不起，它实际上非常简单：

ul {
-webkit-column-count: 2;
   -moz-column-count: 2;
        column-count: 2;
}

看看这个演示

于 2013-02-04T04:27:32.950 回答
8

使用CSS3 列。特别是，如果您设置column-width，它应该根据需要创建尽可能多的列。如果您希望它更喜欢向下而不是为每列提供相同数量的项目，您可以设置column-fill为auto.

于 2013-02-04T04:23:07.927 回答