1.瀏覽器對文本換行的默認(rèn)處理方式
- 緊跟在文字后的?符號 不會出現(xiàn)在行首；遇到空格、短橫都會導(dǎo)致?lián)Q行；
- 對數(shù)字和英文單詞處理方式相近，不會截斷。
- P標(biāo)簽是默認(rèn)是自動換行的
2.利用 ' ';
- ' '; 是一個連接符，保證前后字符連接在一起，統(tǒng)一換行用的。font-size只是為了隱藏這個空格 ，‘&zwj’; 是純粹的連接符，本來應(yīng)該用這個，在使用時發(fā)現(xiàn)，在前英文后中文的地方，該連接符失效了，于是選擇用標(biāo)簽包著‘ ’;來作為替代方案；
另：標(biāo)點符號換行問題需要處理，是因為字體加密，標(biāo)點符號被替換成了其他碼區(qū)，只是顯示得像個標(biāo)點符號，所以瀏覽器對標(biāo)點的換行處理，都需要數(shù)據(jù)添加連接符來解決
<nsbp> </nbsp>
nbsp{
font-size:0;
}
3.CSS自動換行、強制不換行、強制斷行、超出顯示省略號：
- 自動換行
p { word-wrap:break-word; } - 強制不換行
p { white-space:nowrap; } - 強制英文單詞斷行
p { word-break:break-all; }
//注意：設(shè)置強制將英文單詞斷行，需要將行內(nèi)元素設(shè)置為塊級元素。
- 超出顯示省略號
p{text-overflow:ellipsis;overflow:hidden;}
4.換行屬性概念詳解
white-space 屬性設(shè)置如何處理元素內(nèi)的空白
white-space: normal|pre|nowrap|pre-wrap|pre-line|inherit;
normal 默認(rèn)。空白會被瀏覽器忽略。
pre 空白會被瀏覽器保留。其行為方式類似 HTML 中的 pre 標(biāo)簽。
nowrap 文本不會換行，文本會在在同一行上繼續(xù)，直到遇到 br 標(biāo)簽為止。
pre-wrap 保留空白符序列，但是正常地進行換行。
pre-line 合并空白符序列，但是保留換行符。
inherit 規(guī)定應(yīng)該從父元素繼承 white-space 屬性的值。word-wrap 屬性用來標(biāo)明是否允許瀏覽器在單詞內(nèi)進行斷句，這是為了防止當(dāng)一個字符串太長而找不到它的自然斷句點時產(chǎn)生溢出現(xiàn)象。
word-wrap: normal|break-word;
normal: 只在允許的斷字點換行(瀏覽器保持默認(rèn)處理)
break-word:在長單詞或URL地址內(nèi)部進行換行, 首先會嘗試挪到下一行，看看下一行的寬度夠不夠，
不夠的話就進行單詞內(nèi)的斷句word-break 屬性用來標(biāo)明怎么樣進行單詞內(nèi)的斷句。
word-break: normal|break-all|keep-all;
normal：使用瀏覽器默認(rèn)的換行規(guī)則。
break-all:允許再單詞內(nèi)換行，不會把長單詞挪到下一行，而是直接進行單詞內(nèi)的斷句
keep-all:只能在半角空格或連字符處換行
5.參考查詢
* 字體度量、line-height 和 vertical-align
* html 空格字符實體
-
https://www.zhangxinxu.com/wordpress/2015/01/tips-blank-character-chinese-align/
簡直男神，膜拜張大大！！！從事前端兩年多，css還一直是一門玄學(xué)的存在，羞羞~
