javascript – HTML中的垂直包装

我正在寻找一种垂直包装的好方法.我的目标是将一个复选框列表放入div中.我有按字母顺序排序的复选框,我希望列表从div的顶部流到底部,然后当它们到达底部时再次在新列中开始.现在,我可以通过将列表分成服务器端预定义大小的块,然后将其提供给我的html模板.但是当列表变得太长以至于你必须滚动时,事情会变得混乱.我希望强制它只能水平滚动.这不是那么容易,因为我把每个块放在一个漂浮的div中,所以white-space：Nowrap似乎没有削减它.目前,我正在使用 javascript计数列表块的数量并扩展中间容器的宽度(在div中用作视口但包含包含数据的div).我想要一些看起来像这样的东西：

__________________________
| []..... []..... [].....  |
| []..... []..... [].....  |
| []..... [].....          |
| []..... [].....          |
|__________________________|
|<|_____________|___||___|>|

所以我想我有两个问题：

>有垂直包装列表的好方法吗？
>当数据对于视口来说太大时,是否有一种强制水平滚动的好方法？

解决方法

我使用 CSS3 columns.但是到目前为止,只有WebKit(Safari,Chrome,…)和Gecko(Firefox,…)实现了它,你必须添加它们各自的供应商前缀(-moz-column) -width：…; -webkit-column-width：…;)让它工作.

如果IE必须获取列,浮动的div可能是最好的方法.

原文地址：https://www.jb51.cc/js/157811.html