ul和li简单语句实现DIV+CSS分两列（多列）布局显示(转)

显然：UL+LI在布局上比table灵活得多。

比较分两列或者多列显示：

table：你需要在服务器上写一大堆代码判断是不是需要换行，或者切分是不是准确

DIV：你只需要定义好css，剩下的做事情叫交给浏览器吧。

最简单的代码：用ul除以li的宽度=列数

<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 class="mycode">  
    <ul>  
        <li>博客小子</li>  
        <li>博客小子</li>  
        <li>博客小子</li>  
        <li>博客小子</li>  
        <li>博客小子</li>  
        <li>博客小子</li>  
    </ul>  
</div>  

不用多说，这个是最精简的代码，请根据你需要修改！

转载请注明来自博客小子，谢谢。

效果：

博客小子 博客小子

博客小子 博客小子

博客小子 博客小子

转自：http://www.blogguy.cn/show-416-1.html