css文本換行屬性word-wrap和white-space使用總結(jié)
發(fā)布時(shí)間：2013-03-31 16:27:37 作者：佚名 
我要評(píng)論
我要評(píng)論td文字內(nèi)容不換行，發(fā)現(xiàn)是：white-space: nowrap，即強(qiáng)制文本不進(jìn)行換行，接下來(lái)對(duì)文本換行的屬性使用進(jìn)行總結(jié)下，感興趣的朋友可以參考下哈
今天碰到了td文字內(nèi)容不換行，發(fā)現(xiàn)是：white-space: nowrap，即強(qiáng)制文本不進(jìn)行換行，順便看了一下文本換行的屬性word-wrap，總結(jié)如下：
white-space的默認(rèn)只是normal，自動(dòng)換行。
word-break:break-all和word-wrap:break-word表示強(qiáng)制換行，前者若英文字符過(guò)長(zhǎng)自動(dòng)截?cái)啵笳哒麄€(gè)英文單詞會(huì)換行！
而而我常會(huì)這樣用：
word-wrap:break-word; overflow:hidden;
IE 下沒(méi)有任何問(wèn)題，在 FF 下，長(zhǎng)串英文會(huì)被遮住超出的內(nèi)容
table中td.th強(qiáng)制換行方法：
<table style="table-layout:fixed" width="200">
<tr>
<td width="25%" style="word-break : break-all; overflow:hidden; ">站長(zhǎng)網(wǎng)www.software8.co原創(chuàng)教程</td>
<td width="75%" style="word-wrap : break-word; overflow:hidden; ">站長(zhǎng)網(wǎng)www.software8.co原創(chuàng)教程</td>
</tr>
</table>
white-space的默認(rèn)只是normal，自動(dòng)換行。
word-break:break-all和word-wrap:break-word表示強(qiáng)制換行，前者若英文字符過(guò)長(zhǎng)自動(dòng)截?cái)啵笳哒麄€(gè)英文單詞會(huì)換行！
而而我常會(huì)這樣用：
復(fù)制代碼
代碼如下:word-wrap:break-word; overflow:hidden;
IE 下沒(méi)有任何問(wèn)題，在 FF 下，長(zhǎng)串英文會(huì)被遮住超出的內(nèi)容
table中td.th強(qiáng)制換行方法：
復(fù)制代碼
代碼如下:<table style="table-layout:fixed" width="200">
<tr>
<td width="25%" style="word-break : break-all; overflow:hidden; ">站長(zhǎng)網(wǎng)www.software8.co原創(chuàng)教程</td>
<td width="75%" style="word-wrap : break-word; overflow:hidden; ">站長(zhǎng)網(wǎng)www.software8.co原創(chuàng)教程</td>
</tr>
</table>
相關(guān)文章
css 自動(dòng)換行 強(qiáng)制換行屬性 (firefox+ie)
css 自動(dòng)換行 強(qiáng)制換行屬性，在實(shí)際應(yīng)用中，如果不強(qiáng)制換行會(huì)導(dǎo)致頁(yè)面變形很難看，所以用下面的方法，即可解決此類問(wèn)題。2009-10-13- 自動(dòng)換行問(wèn)題,正常字符的換行是比較合理的,而連續(xù)的數(shù)字和英文字符常常將容器撐大,挺讓人頭疼,下面介紹的是CSS如何實(shí)現(xiàn)換行的方法2010-08-27
- 自動(dòng)換行問(wèn)題,正常字符的換行是比較合理的,而連續(xù)的數(shù)字和英文字符常常將容器撐大,挺讓人頭疼,下面介紹的是CSS如何實(shí)現(xiàn)換行的方法2010-08-06
CSS實(shí)現(xiàn)強(qiáng)制不換行、自動(dòng)換行、強(qiáng)制換行的css代碼
CSS實(shí)現(xiàn)強(qiáng)制不換行、自動(dòng)換行、強(qiáng)制換行的css代碼，需要的朋友可以參考下2012-05-03css 解決英文字符與阿位伯?dāng)?shù)字自動(dòng)換行
因?yàn)槎紴g覽器的問(wèn)題，所以要考慮到兼容性。2009-11-20- 自動(dòng)換行問(wèn)題,正常字符的換行是比較合理的,而連續(xù)的數(shù)字和英文字符常常將容器撐大,挺讓人頭疼,下面介紹的是CSS如何實(shí)現(xiàn)換行的方法對(duì)于div,p等塊級(jí)元素正常文字的換行(亞洲2014-11-19