纯css 实现的list 两栏列表
效果：
Item 1 Item 7
Item 2 Item 8
Item 3 Item 9
Item 4 Item 10
Item 5 Item 11
Item 6 Item 12
http://jsfiddle.net/karlikdesign/fmroxyLy/
code
<style>
.list-columns {
-moz-column-count: 2;
-moz-column-gap: 60px;
-webkit-column-count: 2;
-webkit-column-gap: 60px;
column-count: 2;
column-gap: 60px;
}
</style>
<ul class="list-columns">
<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>
<li>Item 10</li>
<li>Item 11</li>
<li>Item 12</li>
</ul>
0
See Also
- 纯CSS简单实现瀑布流布局
- gopher-reading-list go入门与深入学习资源列表
- 前端小姐姐只用 HTML+CSS 作油画
- tachyons CSS 框架不错，准备用它来改youBBS theme
- 请问下 帖子列表可以调用缩略图吗？》
Nearby
- 上一篇 › yb是我一直想要找的论坛程序
- 下一篇 › 前端效果很简洁