如何实现看起来像一个表并具有滚动条的列表（包括图像）

Question

如何实现看起来像这样的列表。如您所见，有3列等分，并且有一个垂直滚动条。

Answer 1

HTML

<ul>
<li>credit</li>
<li>card processing</li>
<li>credit report</li>
...
<li>etc</li>
</ul>

CSS

ul{width:600px;height:100px; overflow-y:scroll;}
li{float:left;width:192px;border:1px solid black;}
li:nth-chilr(n+3){border-top:0xp;}
li:nth-child(3n+2){border-width:1px 0px 1px 0px;}

Fiddle

Answer 2

我个人会给ul一个固定的宽度和高度，然后给它overflow-y:auto;（或scroll）。然后我将li全部display: inline-block和width:32%设为li。我还会将结束标记保留在{{1}}之外，以便它们之间没有不需要的空格。

jsFiddle