text-overflow
概要：其作用是解決文本溢出時(shí)，其展現(xiàn)的形式
該屬性有兩個(gè)參數(shù)，分別如下：
clip:不顯示省略標(biāo)記(....),溢出的文本會(huì)被的裁減掉。
ellipsis：文本溢出時(shí)會(huì)顯示省略的標(biāo)記(...),插入的位置是最后一個(gè)字符。
要使該屬性起作用，還得具備以下幾個(gè)條件。
width | max-width：明確給需要截取文本的容器設(shè)置寬度值。
white-space:nowrap：給文本容器設(shè)置強(qiáng)制不換行，讓元素文本在一行內(nèi)顯示。
overflow:hidden：設(shè)置容器文本溢出時(shí)隱藏。
word-wrap
概要：該屬性可以控制換行。當(dāng)屬性取值break-word時(shí)，將強(qiáng)制換行，中文文本沒有任何問題，英文語句也沒問題。但是對(duì)于對(duì)于長串的英文就不起作用，也就是說，word-wrap是控制是否短詞，而不是斷字符
該屬性有兩個(gè)參數(shù)，分別如下：
normal :默認(rèn)值，瀏覽器只在半角空格或連字符的地方進(jìn)行換行。
break-word: 將內(nèi)容在邊界內(nèi)換行(不截?cái)嘤⑽膯卧~換行)。
其兩者的不同點(diǎn)可以通過下面的對(duì)比圖進(jìn)行區(qū)別。
由圖可知：當(dāng)word-wrap值為normal時(shí)，超長的英文文本長度大于容器的寬度時(shí)會(huì)撐破容器伸展到容器的外面（IE6除外，IE6會(huì)自動(dòng)拓展容器的寬度）。在設(shè)置了break-word時(shí)，長文本會(huì)自動(dòng)換行，不足的是，它不會(huì)安裝單詞換行，可能會(huì)將一個(gè)單詞截?cái)鄵Q行。
同時(shí)，word-wrap應(yīng)用在pre或者table中時(shí)，將不會(huì)起作用。
word-break
概要：屬性主要針對(duì)亞洲語言和非亞洲語言進(jìn)行控制換行。當(dāng)屬性取值break-all時(shí)，可以允許非亞洲語言文本行的任意字內(nèi)斷開；當(dāng)屬性值為keep-all時(shí)，表示在中文、韓文、日文中是不允許字?jǐn)嚅_的。
該屬性的參數(shù)有三個(gè)，其值如下所示：
normal：默認(rèn)值，根據(jù)語言自己的規(guī)則來確定換行方式，中文到邊界上的漢字換行，英文從整個(gè)單詞換行。
break-all：可以強(qiáng)行截?cái)嘤⑽膯卧~，達(dá)到詞內(nèi)換行效果。
keep-all：不允許字?jǐn)嚅_。如果是中文把前后標(biāo)點(diǎn)符合內(nèi)的一個(gè)漢字短語整個(gè)換行，英文單詞整個(gè)換行；如果出現(xiàn)某個(gè)英文字符長度超過容器邊界，后面的部分將撐破容器，如果邊框?yàn)楣潭▽傩裕瑒t后面的部分無法顯示。(PS:chrome該屬性無效，但是新增break-word屬性)
新聞熱點(diǎn)
疑難解答
圖片精選
