強(qiáng)制換行與強(qiáng)制不換行問題曾經(jīng)一度困擾著我，每當(dāng)遇到換行問題時候那就是痛苦回憶的開始，現(xiàn)在終于痛定思痛，一鼓作氣把這個長期頑固問題給解決。

強(qiáng)制換行與強(qiáng)制不換行用到的屬性

我們一般控制換行所用到的CSS屬性一共有三個：word-wrap; word-break; white-space。這三個屬性可以說是專為了文字?jǐn)嘈卸鴦?chuàng)造出來的。首先我們得知道這三個屬性到底是做什么用地：

word-wrap語法：

word-wrap: normal(默認(rèn)) | break-word
各個瀏覽器均能識別

參數(shù)：

normal: 允許內(nèi)容頂開指定的容器邊界。
break-word: 內(nèi)容將在邊界內(nèi)換行。必要時會觸發(fā)word-break（注意：請分辨清楚word-break和break-word這倆個是不同的東西，一為屬性另為參數(shù)）。

說明：

word-wrap是控制是否“為詞斷行”的，設(shè)置或檢索當(dāng)前行超過指定容器的邊界時是否斷開轉(zhuǎn)行。中文沒有任何問題，英文語句也沒問題。但是對于長串的英文，就不起作用。

范例：

congratulation這個單詞屬于長串英文，word-wrap:break-word整個單詞看成一個整體，如果該行末端寬度不夠顯示整個單詞，它會自動把整個單詞放到下一行，而不會把單詞截斷，這就是對于長串文字不起作用的解釋。word-wrap:normal是默認(rèn)情況，英文單詞不被拆開。

結(jié)論：

作用范圍僅為div這類標(biāo)準(zhǔn)塊級元素，th,td這類table元素雖然識別但是沒有效果（如果為td,th加上寬度word-wrap在IE下是能夠發(fā)揮效果的，但根據(jù)完全兼容性方便記憶角度上來說還是以前面的結(jié)論為準(zhǔn)）。

word-break語法：

word-break: normal(默認(rèn)) | break-all | keep-all
Firefox、Opera不能識別

參數(shù)：

normal: 依照亞洲語言和非亞洲語言的文本規(guī)則，允許在字內(nèi)換行。
break-all: 該行為與亞洲語言的normal相同。也允許非亞洲語言文本行的任意字內(nèi)斷開。該值適合包含一些非亞洲文本的亞洲文本。
keep-all: 與所有非亞洲語言的normal相同。對于中文，韓文，日文，不允許字?jǐn)嚅_。適合包含少量亞洲文本的非亞洲文本。

說明：

word-break:break-all，是斷開單詞。在單詞到邊界時，下個字母自動到下一行。主要解決了長串英文的問題（恰恰彌補(bǔ)了上面word-wrap:break-word對于長串文字不起作用的缺陷）。

范例：

繼續(xù)以上面congratulation這個單詞屬于長串英文，word-break:break-all它會把單詞截斷，該行末端就會變成類似conra(congratulation的前端部分)，下一行為tulation（conguatulation）的后端部分了。
word-break:keep-all，是指Chinese, Japanese, and Korean不斷詞。即只用此時，不用word-wrap，中文就不會換行了。（英文語句正常。）