使用CSS3文本換行的方法介紹

一、

目前可由主流支援的：

 text-overflow 主要解決文字溢出，

取值：clip[ 預設值] | ellipsis | string (僅支援Firefox)

配合  white-space : nowrap ; overflow : hidden  使用

二、

word-wrap 

取值：normal [預設值] | break-word

--長字換行

word-break  

取值：normal  [ 預設值] | break-all | keep-all 

--非CJK（"中日韓"）腳本的斷行規則

#潛規則－預設（不寫任何樣式的顯示規則）：

①單字末尾放不下：另起一行，

②長單字過長且字母連續：不折斷

③長單字過長且帶破折號：保守折斷  

重點：下述常用的三種樣式針對上述3種潛規則進行改進的區別

word-wrap：break-word  長單字過長且字母連續：吻合斷裂

                              

word-break：keep-all       長字過長且帶破折號        [ 改③ 潛規則 ①②不變]

word-break：break-all      字末          ：吻合處折斷 

#                  地                長字過長度且有破折號：吻合處折斷 

                             [最強：潛規則 ①②③全部改變]    

#保守折斷是依照一定格式折斷，吻合處則是不留任何邊界空白的折斷

以上是使用CSS3文本換行的方法介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！