日期:2014-05-17  浏览次数:20778 次

怎样用CSS设置使列表列LI具有分栏效果
如题,怎样才可使如下结构有分栏效果
<div>
    <ul>
      <li> dddddddddd </li>
      <li> dddddddddd </li>
      .
      .
      .
    </ul>
</div>
我见央视网页http://discovery.cctv.com/21/index.shtml是这样作的但看不懂请各位赐教.谢谢了


------解决方案--------------------
try
-----------------------------------------------
<style>
.list{
width:300px;
border:1px solid #888;
margin:0px;
padding:0px;
}

.list li{
float:left;
width:50%;
}
</style>
<ul class= "list ">
<li> 1 </li>
<li> 2 </li>
<li> 3 </li>
<li> 4 </li>
<li> 5 </li>
<li> 6 </li>
<li> 7 </li>
<li> 8 </li>
</ul>

------解决方案--------------------
不知道你要什么效果> > >
<style type= "text/css ">
#a li{text-align:left;}
#a li span{display:block;float:right;}
</style>
<div id= "a ">
<ul>
<li> dsfasdf <span> 2007-12-12 </span> </li>
<li> fdsfsdafasdf <span> 2007-12-12 </span> </li>
<li> asdfasdfasd <span> 2007-12-12 </span> </li>
</ul> </div>