将ul+li 分两列显示(横向显示)的方法

ttx9n

有一个 ul>li 列表，默认为单列显示，把它变为两列显示可以使用DIV+CSS代码，也可以直接使用CSS控制，感兴趣的朋友可以参考了下哈，希望对你有所帮助 目的很简单：有一个 ul>li 列表，默认为单列显示，把它变为两列显示。
方法1，使用DIV+CSS代码：

复制代码代码如下:
<style type="text/css">
.mycode{ width:300px; height:74px; float:left;}
.mycode ul{ width:280px;}
.mycode li{ width:100px; float:left; display:block;}
</style>
<div>
<ul>
<li>ABC</li>
<li>ABC</li>
<li>ABC</li>
<li>ABC</li>
<li>ABC</li>
<li>ABC</li>
</ul>
</div>

方法2，直接使用CSS控制

复制代码代码如下:
<style type="text/css">
.list{width:400px;overflow:hidden;zoom:1;border:1px solid #ccc}
.list li{float:left;width:190px;padding:5px}
</style>
<ul class="list">
<li>ABC</li>
<li>ABC</li>
<li>ABC</li>
<li>ABC</li>
<li>ABC</li>
<li>ABC</li>
</ul>

czoz5y

这个源码不错啊

a75620618

撒旦撒旦撒擦擦擦擦

e8hwl6prw

啦啦啦啦啦啦啦啦！

locopy

你们谁看了弄洒了可能

jasonlong

了乐趣了去了去了去了去了

360784533

儿童服务绯闻绯闻绯闻

5cf304mn2

灌灌灌灌水

idy6_yus

天天源码社区www.tiantianym.com

回复用户5

抽根烟，下来看看再说