研究了一下，其实挺简单的就是,ul给个宽度,然后LI也同样给个宽度和高度,当li的宽度超过ul的宽度的时候,li就会自动换行.
li自动换行效果
<html><body>
<style>
.contentT{ clear:both; border-top:1px solid #fff; border-left:1px solid #fff;}
.contentT ul{ width: 300px; }
.contentT li{
float:left; list-style-type:none;
height:14px; width:52px;
display:block;
border-right:1px solid #fff;
border-bottom:1px solid #fff; padding:4px 0 2px;
}</style>
<div class="contentT">
<ul>
<li>北京</li>
<li>广东</li>
<li>上海</li>
<li>山东</li>
<li>江苏</li>
<li>四川</li>
<li>浙江</li>
<li>河南</li>
<li>辽宁</li>
<li>陕西</li>
<li>湖北</li>
<li>湖南</li>
<li>福建</li>
<li>重庆</li>
<li>安徽</li>
<li>河北</li>
<li>山西</li>
<li>广西</li>
<li>江西</li>
<li>甘肃</li>
<li>天津</li>
<li>贵州</li>
<li>吉林</li>
<li>海南</li>
<li>云南</li>
<li>新疆</li>
<li>宁夏</li>
<li>青海</li>
<li>西藏</li>
<li>黑龙江</li>
<li>内蒙古</li>
</ul>
</div></html></body>
<style>
.contentT{ clear:both; border-top:1px solid #fff; border-left:1px solid #fff;}
.contentT ul{ width: 300px; }
.contentT li{
float:left; list-style-type:none;
height:14px; width:52px;
display:block;
border-right:1px solid #fff;
border-bottom:1px solid #fff; padding:4px 0 2px;
}</style>
<div class="contentT">
<ul>
<li>北京</li>
<li>广东</li>
<li>上海</li>
<li>山东</li>
<li>江苏</li>
<li>四川</li>
<li>浙江</li>
<li>河南</li>
<li>辽宁</li>
<li>陕西</li>
<li>湖北</li>
<li>湖南</li>
<li>福建</li>
<li>重庆</li>
<li>安徽</li>
<li>河北</li>
<li>山西</li>
<li>广西</li>
<li>江西</li>
<li>甘肃</li>
<li>天津</li>
<li>贵州</li>
<li>吉林</li>
<li>海南</li>
<li>云南</li>
<li>新疆</li>
<li>宁夏</li>
<li>青海</li>
<li>西藏</li>
<li>黑龙江</li>
<li>内蒙古</li>
</ul>
</div></html></body>
259
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
