我如何订购这样的HTML列表与CSS或JavaScript？

我想订购这个订单中的物品清单（附图）。每列应该有5行，然后接下来的5获得另一列，并继续...我如何订购这样的HTML列表与CSS或JavaScript？

这个列表是动态生成的，通过sql查询在li标签上有一个循环。

，所以我只需要找到一种方法，责令其在JavaScript或CSS这样...

Example

来源

2012-07-29 daren1212

你想要它按这样的数字排序？还是这样呢？ – Shawn31313 2012-07-29 18:26:25

它没有这样排序，这是我想要做的... – daren1212 2012-07-29 18:27:48

好吧，让我看看我能做些什么。 – Shawn31313 2012-07-29 18:30:22

你可以在这里找到一个很好的例子。 http://www.alistapart.com/d/multicolumnlists/example1.html enter link description here

您还可以创建3个以1,6和11开头的列表。在这种情况下，您根本不需要css或js。像这样：

<ol start="1">....</ol> 
<ol start="6">....</ol> 
<ol start="11">....</ol>

来源

2012-07-29 19:04:20

看看多列环境。 specification目前是一个候选推荐，所以它不应该改变那么多。请记住，这在IE prior to version 10中没有实现，但是有一个JavaScript fallback应该可以工作，即使在列表中。

<ol> 
    <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> 
</ol>

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

请注意，您必须从某个地方指定的实际数额列。但是，如果您的SQL查询的每个记录都等于一个项目，则可以使用类似count($result)/5的内容。

Demo

来源

2012-07-29 19:10:18 Zeta

+1您应该添加非供应商前缀规则（'列计数'）最后虽然 – steveax 2012-07-29 19:14:10

@ steveax：我已经添加这相当instantaneous在我发布我的原来的答案，但我忘了将它添加到演示。谢谢你的提示。 – Zeta 2012-07-29 19:15:53

我看不到数字 – codingbiz 2012-07-29 19:19:58

我如何订购这样的HTML列表与CSS或JavaScript？

回答

相关问题