Li标签Float:left在做网页侧栏的一些tags的时候，是一种很好的选择。 不过在中文字符换行问题上，可能会出现一点小问题，先看一张IE7和IE8下的效果图吧： 上图IE7的效果看起来的确很蛋疼，但是在标准浏览器中是不会出现上图IE7的效果的。 首先看下CSS代码结
Li标签Float:left在做网页侧栏的一些tags的时候，是一种很好的选择。
不过在中文字符换行问题上，可能会出现一点小问题，先看一张IE7和IE8下的效果图吧：
上图IE7的效果看起来的确很蛋疼，但是在标准浏览器中是不会出现上图IE7的效果的。
首先看下CSS代码结构
.city {
width:200px;
border: 1px solid black;
overflow: hidden;
padding: 0;
margin:0;
}
.city li{
float:left;
list-style: none;
margin: 5px;
}其次是HTML结构
<div class="box">
<h3>City</h3>
<ul class="city">
<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>其实方案很简单，就是在Li中添加一条样式 white-space: nowrap;
.city li{
float:left;
list-style: none;
margin: 5px;
white-space: nowrap;
}原文地址：float:left li中文标签在IE7中被自动折行, 感谢原作者分享。
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
11051
收藏
