强制换行
自动换行
div{
word-wrap: break-word;
word-break: normal;
}
word-wrap: break-word;
word-break: normal;
}
强迫不换行
div{
white-space:nowrap;
}
white-space:nowrap;
}
带有浮动效果的 不换行
<div id="pic">
<ul>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/imgget1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
</ul>
</div>
<ul>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/imgget1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
<li><img src="http://192.168.1.103/hibeans/web/images/temporary/car_t1.jpg" /></li>
</ul>
</div>
#pic {float:left; width:920px; margin:0 10px;}
#pic ul {margin:15px 0; white-space:nowrap; width:920px; overflow:hidden;}
#pic li {*float:left; width:90px; margin:0 5px; *clear:right; border:1px solid #B7DEEF; text-align:center; display:inline-block}
#pic li img {max-width:90px; max-height:90px; vertical-align:middle;}
#pic ul {margin:15px 0; white-space:nowrap; width:920px; overflow:hidden;}
#pic li {*float:left; width:90px; margin:0 5px; *clear:right; border:1px solid #B7DEEF; text-align:center; display:inline-block}
#pic li img {max-width:90px; max-height:90px; vertical-align:middle;}
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步