強制不換行

div{
white-space:nowrap;
}

自動換行

div{?
word-wrap: break-word;?
word-break: normal;?
}

強制英文單詞斷行

div{
word-break:break-all;
}

自動換行

?

div{??
word-wrap:?break-word;??
word-break:?normal;??
}?

?

強迫不換行

?

div{??
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>
#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;}

總結

以上是生活随笔為你收集整理的CSS自动换行,强迫不换行的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。